Is there a way to pause a gif in my website?

Discussion in 'Web Design and Development' started by Figory, Nov 26, 2013.

  1. Figory macrumors member

    Joined:
    May 17, 2004
    #1
    I created a basic gif and included it into the rapid weaver site I am building. However I really want to be able to pause the gif on hover

    Is this possible? I'd be really grateful for any info

    my test site is here where you can see the gif

    THANKs for any help!
     
  2. Apple Key macrumors 6502a

    Apple Key

    Joined:
    Jan 4, 2012
    #2
    I'm not sure if this is possible. If it is possible, it would be pretty complex and would require some custom javascript programming.

    A simpler way to do this would be to generate individual images and have the images cycle using a jQuery plugin. Then have the animation stop when you hover over an image.

    Here is one plugin that could do what I've described. You would need to turn off any effects so that the animation is seamless. Also adjust the speed, of course to match your animated gif.

    http://jquery.malsup.com/cycle/
    http://jquery.malsup.com/cycle/none.html
    http://jquery.malsup.com/cycle2/

    Let me know if you have any questions. Hope this helps.
     
  3. Darth.Titan macrumors 68030

    Darth.Titan

    Joined:
    Oct 31, 2007
    Location:
    Austin, TX
    #3
    Or, you could create a new image from a single frame, and change the animated gif to the still image on hover.
     
  4. Apple Key macrumors 6502a

    Apple Key

    Joined:
    Jan 4, 2012
    #4
    You would need to make sure the animation has finished loading and then programmatically measure which frame of the animation it is on (by setting the timing so that it knows which frame it's on). Then once the user has moved their mouse off of that area, you would need a way for the animation to begin again from the frame which was last shown, which I believe, is not something that can be controlled via javascript.

    Unless I'm totally over thinking it and there is a much simpler way.
     
  5. Darth.Titan macrumors 68030

    Darth.Titan

    Joined:
    Oct 31, 2007
    Location:
    Austin, TX
    #5
    No, I absolutely would not do all that (Pretty sure what you described is not even possible). Not knowing how complex the OP's animated gif and requirements are I simply meant to provide a quicker alternative solution That could work perfectly well depending on the situation.

    If the level of perfection you describe was required, your first suggestion would be the way to go.
     
  6. nomade macrumors member

    nomade

    Joined:
    Dec 2, 2006
    #6
  7. Apple Key macrumors 6502a

    Apple Key

    Joined:
    Jan 4, 2012
    #7
    I guess I kind of assumed the OP wanted it to resume from where it left off when the user stopped hovering over the image. The image flashes very quickly from one frame to the next, and that's why I thought it made sense to do that. It's 7 frames shown for 0.3 seconds per frame.

    If not, then your solution would work well and be quick to implement, as you mentioned.
     

Share This Page