1

I have a code for my site, when an image is clicked a pop up window displays which is working fine. However, whenever I roll over the first rollover works, but the original image before the rollover does not show anymore? why is this?

 <input name="image" type="image" onMouseOver= src="http://japanesefriend.zxq.net/images/x11_title.gif" onMouseOut= src="http://japanesefriend.zxq.net/images/level4_nouns_08.gif'"  value="Place Order" src="http://japanesefriend.zxq.net/images/level4_nouns_08.gif" onClick='styledPopupOpen("<img src=http://japanesefriend.zxq.net/flashcards/go.gif />")'  align=middle width=164 height=154>
JJJ
  • 32,902
  • 20
  • 89
  • 102
Miura-shi
  • 4,409
  • 5
  • 36
  • 55

3 Answers3

2

Use CSS sprites for rollovers.

Marat Tanalin
  • 13,927
  • 1
  • 36
  • 52
2

Your HTML is invalid.

This...

onMouseOver= src="http://japanesefriend.zxq.net/images/x11_title.gif"

should be this...

onMouseOver="this.src='http://japanesefriend.zxq.net/images/x11_title.gif'"

Same for the onMouseOut...

onMouseOut="this.src='http://japanesefriend.zxq.net/images/level4_nouns_08.gif'"

DEMO: http://jsfiddle.net/XBLfN/

Or you can eliminate this. and just do src='http://...

onMouseOver="src='http://japanesefriend.zxq.net/images/x11_title.gif'"
onMouseOut="src='http://japanesefriend.zxq.net/images/level4_nouns_08.gif'"

DEMO: http://jsfiddle.net/XBLfN/1/

  • Ah! Ok I understand now! How would I add on the pop up window line to this though? It seems to not be working. Thanks for taking your time to help me! So appreciated! – Miura-shi Mar 24 '12 at 16:50
1

see: rollover image with buttons

this seems to be a duplicate - the solution in the above question shoudl work for you.

For chrome (and even for other browsers), it is always a good idea to validate your html: http://validator.w3.org/

Community
  • 1
  • 1
Vijay Agrawal
  • 3,751
  • 2
  • 23
  • 25