DaniWeb IT Discussion Community

DaniWeb IT Discussion Community (http://www.daniweb.com/forums/)

- JavaScript / DHTML / AJAX (http://www.daniweb.com/forums/forum117.html)

- - image rollover (http://www.daniweb.com/forums/thread121401.html)

I get flickering images when i use this code for an image rollover change, i used the same code on a different website a while back and it worked but now i only get a flicker instead of the second image...

If anybody knows why please respond :) (website where it's used: http://www.pektop.be )

<ul class="menulist">

      <li><a href="index.php" onmouseover="document.l1.src='menumouse_01.gif'" onmouseout="document.l1.src='images/menunorm_01.gif'"><img src="images/menunorm_01.gif" border="0" name="l1" /></a></li>

      <li><a href="index.php" onmouseover="document.l2.src='menumouse_02.gif'" onmouseout="document.l2.src='images/menunorm_02.gif'"><img src="images/menunorm_02.gif" border="0" name="l2" /></a></li>

      <li><a href="index.php" onmouseover="document.l3.src='menumouse_03.gif'" onmouseout="document.l3.src='images/menunorm_03.gif'"><img src="images/menunorm_03.gif" border="0" name="l3" /></a></li>

      <li><a href="index.php" onmouseover="document.l4.src='menumouse_04.gif'" onmouseout="document.l4.src='images/menunorm_04.gif'"><img src="images/menunorm_04.gif" border="0" name="l4" /></a></li>

      <li><a href="index.php" onmouseover="document.l5.src='menumouse_05.gif'" onmouseout="document.l5.src='images/menunorm_05.gif'"><img src="images/menunorm_05.gif" border="0" name="l5" /></a></li>

    </ul>

Re: image rollover

Name is deprecated. Use ID.

You have a scoping problem. You are using the names in onmouseover and onmouseout attributes outside the area where those names are defined. You need external scripts

And I am totally sick of websites that make pictures larger when the mouse goes over them. Just leave them large!

Re: image rollover

According to the HTML 4.01 specification:

Quote:

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

Plus NAME attribute is deprecated for *non-form* elements; use ID instead. And a better way to access images would be document.images["imageId"]. Also, are you preloading the images?

Re: image rollover

Er no I'm not preloading the images, was planning on putting that in but still need to find out how

Re: image rollover

> but still need to find out how

Find out how to preload images? Google has a lot of helpful links to get you started. If you still are facing issues, let us know.