Solved

onclick animation...

Posted on 1997-12-11
3
937 Views
Last Modified: 2013-11-19
I know how to use rollover javascripts to make a (hyperlinked) image change state before being clicked on (onmouseover/onmouseout), but is there a way of changing state for a non-hyperlinked image? Specifically, I want a static image which animates when clicked on. The animation can be handled by using an animated GIF, I just need someone to give me the right script (some variation of onClick I would imagine, but I don't really know enough about it...).

Cheers.
Ian Westbrook
0
Comment
Question by:westbrook
[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
  • 2
3 Comments
 
LVL 4

Accepted Solution

by:
jshamlin earned 100 total points
ID: 1276088
There's presently no method to detect an onMouseover event for a "regular" image - you can create a "fake" link to manipulate it, though:

<A HREF="javascript:doThis()"><IMG SRC="thing.gif"></A>

Note that the function doThis() will be executed onClick - if you'd like the click to do nothing, then create an "empty" function for doThis().  You may also add event handlers to the HREF to manipulate the image onMouseover, etc.
0
 
LVL 6

Expert Comment

by:tecbuilder
ID: 1276089
If my comment works better for you, I would like the opportunity to post this as an answer.
0
 
LVL 6

Expert Comment

by:tecbuilder
ID: 1276090
I'm sure jshamlin's answer works, but at my level of knowledge 'empty functions' means nothing... techbuilder's answer is both more elegant and works, so at the risk of offending jshamlin, I think I'd rather his answer was posted.
But thank you both for your time!

Best regards,

Ian Westbrook
0

Featured Post

Instantly Create Instructional Tutorials

Contextual Guidance at the moment of need helps your employees adopt to new software or processes instantly. Boost knowledge retention and employee engagement step-by-step with one easy solution.

Question has a verified solution.

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

This article covers the basics of the Sass, which is a CSS extension language. You will learn about variables, mixins, and nesting.
JavaScript has plenty of pieces of code people often just copy/paste from somewhere but never quite fully understand. Self-Executing functions are just one good example that I'll try to demystify here.
Viewers will learn about the regular for loop in Java and how to use it. Definition: Break the for loop down into 3 parts: Syntax when using for loops: Example using a for loop:
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

726 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