Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

How to play GIF's on mouseover ONLY

Posted on 2001-07-30
8
Medium Priority
?
768 Views
Last Modified: 2012-05-04
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.
0
Comment
Question by:KAbbott
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
8 Comments
 
LVL 5

Expert Comment

by:raizon
ID: 6334533
Have the mouseover be the animated gif and the mouseoff be the static one.
0
 
LVL 8

Expert Comment

by:bebonham
ID: 6334569
TRY:

<IMG SRC="animated.gif" ONMOUSEOVER="this.src=this.src + '?' + Math.random()">
0
 
LVL 2

Author Comment

by:KAbbott
ID: 6334737
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.
0
Understanding Web Applications

Without even knowing it, most of us are using web applications on a daily basis. Gmail and Yahoo email, Twitter, Facebook, and eBay are used by most of us daily—and they are web applications. We often confuse these web applications tools for websites.  So, what is the difference?

 
LVL 7

Expert Comment

by:ClassyLinks
ID: 6334824
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">
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 6335753
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

HTH

Cd&
0
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 200 total points
ID: 6425567
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?

???????????????????????????????????????

Cd&
0
 
LVL 2

Author Comment

by:KAbbott
ID: 6450521
Can't even remember why I needed to know this now, but here goes
0
 
LVL 1

Expert Comment

by:Computer101
ID: 6450772
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.
http://www.experts-exchange.com/jsp/cmtyQuestAnswer.jsp#3

Thank you
Computer101
Community Support Moderator
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

FAQ pages provide a simple way for you to supply and for customers to find answers to the most common questions about your company. Here are six reasons why your company website should have a FAQ page
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to dynamically set the form action using jQuery.
Suggested Courses

636 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question