I am trying to make a plugin that will:
- add sounds to a gif
- present a gif as a ‘movie’ starting and stopping on a click.
I do not really know what I am doing. I have seen a few plugins that ‘freeze’ a gif until clicked, they seem to generate a jpg from the the gif. The approach here is different:
- A shortcode [gifmovie gif=’gif-url’ mp3=’mp3-url’]eg:
[gifmovie gif='http://38.media.tumblr.com/5704f412385f040cb6c7e232519867c7/tumblr_npstce4Hpp1rggurro1_500.gif' mp3='http://freesound.org/data/previews/157/157873_2836235-lq.mp3']
- The short code adds the gif with a class of gifmovie and an attribute of mp3
- Javascript then adds a canvas element, put a frame from the gif on and a play button, it hides the gif. Adds an audio element for the mp3. Clicking hide canvas, shows gif and play audio.