simple flip image javascript

March 25th, 2005

Filed under:  at 11:57am

sometimes you want an image to change when you select a different option in a dropdown, i used to do it the hard way:
function flip() { document.images.x.src="themes/x/"+ document.reg.thememem.options[document.reg.thememem.selectedIndex].value+".gif"; }

i had to write a new js function for every new dropdown i use. so i looked for an easier way and wrote something:
function flip(image_id, select_name) { document.getElementById(image_id).src = select_name.options[select_name.selectedIndex].value }

to use it, do something like:
<select name="myselect" onchange="flip('myImage', this)"> <option value="images/candle.gif">candle</option> <option value="images/coin.gif">coin</option> <option value="images/earth.gif">earth</option> </select> <img id="myImage" src="images/balloons.gif">

obviously if you want to call it a second time, just pass a different image_id to it and make sure it matches the id attribute of your second img tag :)

del.icio.us:simple flip image javascript digg:simple flip image javascript spurl:simple flip image javascript wists:simple flip image javascript simpy:simple flip image javascript stumbleupon:simple flip image javascript blinklist:simple flip image javascript furl:simple flip image javascript reddit:simple flip image javascript fark:simple flip image javascript blogmarks:simple flip image javascript Y!:simple flip image javascript smarking:simple flip image javascript magnolia:simple flip image javascript segnalo:simple flip image javascript gifttagging:simple flip image javascript

Related Posts


4 Comments Leave a Comment

Cine [ Quote ]

Fuuunky. I’ve always been looking for a smart way to do that.

March 25th, 2005 at 6:03 pm
Bubs [ Quote ]

I’m going to try and teach myself javascript over the break :)

March 25th, 2005 at 8:45 pm
Dayna [ Quote ]

javascripts.. I always can’t seems to figure out how to use them and when I did.. there are errors and problems here and there… :blush:

March 26th, 2005 at 7:22 am
Ex [ Quote ]

I like it -) nice and simple -)

October 10th, 2008 at 8:06 am

Leave a Comment Name, email and comment are required.
Email will never be displayed.

Leave a Comment
  4. :biggrin: :blank: :blush: :bored: :confused: :cool: :down: :evil: :frown: :grin: :grr: :laidback: :left: :mad: :right: :sad: :secret: :shock: :smile: :stress: :tongue: :up: :wink: :yawn: :cute: :dead: :film: :floppy: :glasses: :grumpy: :headphones: :heart: :lightbulb: :ouch: :tv: :upsidedown: :vodka: :yell: :yuck: :yummy: