• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 780
  • Last Modified:

How to play GIF's on mouseover ONLY

I've created a GIF file (animated) and I want this animation to play only when I mouseover the image.

At the moment all that happens is the animation takes place as soon as the page is loaded, as this is a rollover button (thats animated) it doesn't look very good.

Does anyone know how to do this?   Thanks.

p.s  I'm using Ultradev 4 with Photoshop 6 to create this website.
1 Solution
Have the mouseover be the animated gif and the mouseoff be the static one.

<IMG SRC="animated.gif" ONMOUSEOVER="this.src=this.src + '?' + Math.random()">
KAbbottAuthor Commented:
Thanks for your answers so far.

bebonham I've tried your piece of code and heres what the conclusion is:

It works in IE but not Netscape.
Also it plays the GIF before I mouseover and stays on the final frame.

What I want it todo is:

I only want the GIF to play once the mouse cursor has been put over the image.  At the moment the GIF is constantly on frame 10, when I mouse over it plays from frame 1 to 10 and stays on 10.

What I want it to do is stay on frame 1 and when I mouseover it plays to frame 10, when I mouse out to return to frame 1.

Is this possible?  Thanks is advance.
Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

I think raizon pointed you in the right direction.

Save frame1 as a separate gif.  Then set the mouseover to be the complete animation.

<IMG SRC="frame1.gif" ONMOUSEOVER="fullgif.gif">
First of all you need to preload the animated gif by putting this in the head:
<script language="JavaScript">
image1 = new Image();
image1.src = "animated.gif";

A mouseover on an image won't work in Netscrap you do it this way

<a href="Javascript:;" onMouseover="document.images['theimage'].src='animated.gif'"
                       on Mouseout="document.images['theimage'].src='static.gif'">
<img src="static.gif" border=0></a>

You create static gif as frame one of the animated gif


So KAbbot, what's the deal.  did you get the answer and leave without saying thank you, by accepting an answer?

Did you forget this?

Did you give up on it?

Did you fall ill, and are thus not able to respond?


KAbbottAuthor Commented:
Can't even remember why I needed to know this now, but here goes
Hello KAbbott,
After review of this question, I see that it is not deserving of an C grade (Based on the link below).  If you feel this is error, please respond.
E-E question grading link for your information.

Thank you
Community Support Moderator
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Get expert help—faster!

Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now