More than one way to frame a gif

I’ve done a fair number of Multi-Frame GIF Story Assignments and I really like them. One thing I do not like is having to have each animation at the same rate and with the same number of frames. You can work round this by ‘freeze’ framing a particular frame or several frames, but I quite like the idea of the gifs all going at their own rate and not moving in sync.

After I’d giffed a few from Perchance to Dream I though I’d try a slightly different approach. I’ve uploaded all the gifs, but instead of inserting them I created a bit of html to show the gifs.

1. For each gif I found out its url, eg http://johnjohnston.info/106/wp-content/uploads/2013/05/darkness.gif
2. I then created a img tag for each gif: <img src=”http://johnjohnston.info/106/wp-content/uploads/2013/05/darkness.gif” alt=”Darkness”>
3. I edit the post, putting the code to show each gif inside a single div tag, that tag has a class:
4. <div class=”gifgrid”> then a list of the gif tags </div>
5. I put in a style snippet to scale the gifs to one third of the space they are in each: <style>.gifgrid img{width:33%;float:left}</style>
6. I made sure there were no returns in the code.
7. I switched the blog editor to code vive and pasted in the code.

I’ve put the code into an external page too, if you want to have a look: perchance_grid , where you can easily view the code.

Perchance to Dream has been my favourite episode so far. I’ve not left enough time to write much about it and I’ll be stepping out of the ds106zone for the next week, which means I’ll miss audio week. I might join in the odd daly create, but if not I’ll be back in the zone next weekend.