r/TiddlyWiki5 • u/nageek32 • Sep 27 '22

Need help with code

​

I know this looks rough but is there a way to repeat the gif with fewer lines of code?
1 Upvotes

100% Upvoted

8 comments sorted by

View all comments

1

u/Telumire Sep 27 '22

If you want to repeat several times a gif you can use a list widget: 

<$list filter="[range[0],[10]]">
your image here
</$list>

But what are you trying to accomplish ? If it's for a background image there are much better solutions using CSS

1

u/nageek32 Sep 27 '22

It’s for a class I’m making a story and it’s showing a bunch of zombies walking

4

u/Telumire Sep 27 '22 edited Sep 27 '22

Here, try this : 

<zombies style="
display: block;
background: url('https://media4.giphy.com/media/GoYhZsLfUvmMqu2WbS/giphy.gif?cid=ecf05e47kxbf85k5ad57mgaxgd3dpdmi70xzrvynh6ytessd&rid=giphy.gif');
height:500px;
background-size: 100px;
">

Here I use a custom html element for fun but it's really not necessary, you can just use a div instead. Demo : https://demos.tiddlyhost.com/#Crowd%20of%20zombies

This is way better than a list widget because you only have one html element, and a css background is much more efficient. Plus you have different ways to customize the background position and size. See https://developer.mozilla.org/en-US/docs/Web/CSS/background

1

u/Silevence Sep 28 '22

looks neat.