Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Do mouseovers need to download before being clicked on?

Status
Not open for further replies.

freddyboy

Technical User
Apr 18, 2000
26
US
Here's a simple one I hope.&nbsp;&nbsp;I want to know if I create a menu page that utilizes mouseovers to link to other pages <br>&nbsp;(I'm using text to graphic rollover link)&nbsp;&nbsp;will all the graphic mouseovers need to download in cache before the page can be used.&nbsp;&nbsp;Or will the rollover graphic download only until the visitor clicks on the mouseover?
 
Yes, graphics need to be downloaded into cache before they can be seen. That's why, on some pages with rollovers, you end up waiting every time you move your mouse for the graphic to show up. The best way to do rollovers is preloading. Here's a typical script:<br><FONT FACE=monospace><br><br>&lt;SCRIPT&gt;<br>&nbsp;&nbsp;&lt;!--<br>&nbsp;&nbsp;&nbsp;&nbsp;// declare new images<br>&nbsp;&nbsp;&nbsp;&nbsp;yourImage = new Image;<br>&nbsp;&nbsp;&nbsp;&nbsp;yourImageOver = new Image;<br><br>&nbsp;&nbsp;&nbsp;&nbsp;// assign image values<br>&nbsp;&nbsp;&nbsp;&nbsp;yourImageNormal.src = &quot;images/normal.gif&quot;;<br>&nbsp;&nbsp;&nbsp;&nbsp;yourImageOver.src = &quot;images/special.gif&quot;;<br><br>&nbsp;&nbsp;&nbsp;&nbsp;function highlight (source) {<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;imageHighlighted = eval(source + &quot;Over.src&quot;);<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;document [source].src = imageHighlighted;<br>&nbsp;&nbsp;&nbsp;&nbsp;}<br><br>&nbsp;&nbsp;&nbsp;&nbsp;function dim (source) {<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;imageDimmed = eval(selected + &quot;Normal.src&quot;);<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;document [source].src = imageDimmed;<br>&nbsp;&nbsp;&nbsp;&nbsp;}<br>&nbsp;&nbsp;//--&gt;<br>&lt;/SCRIPT&gt;<br>&lt;/HEAD&gt;<br>&lt;BODY&gt;<br>&lt;A HREF=&quot;link.html&quot; onMouseOver=&quot;highlight('yourImage')&quot; onMouseOut=&quot;dim('yourImage')&quot;&gt;&lt;IMG SRC=&quot;images/normal.gif&quot; NAME=&quot;yourImage&quot; ALT=&quot;your image description&quot; BORDER=&quot;0&quot;&gt;&lt;/A&gt;<br>&lt;/BODY&gt;<br><br>Try that, see if it works. I haven't checked that particular script, that's a stripped down version of something I wrote, but that particular script is probably everywhere on the web. Best of luck. <p>Liam Morley<br><a href=mailto:lmorley@wpi.edu>lmorley@wpi.edu</a><br><a href=] :: imotic :: website :: [</a><br>"light the deep, and bring silence to the world.<br>
light the world, and bring depth to the silence.
 
Liam,<br><br>&gt;The best way to do rollovers is preloading. Here's a typical script:<br><br>That is an arguable statement for sure! Some would not agree with that at all. If you have large images or many images to download for rollovers, preloading them will cause the rest of the page to display after the images are loaded making the page loading seem very slow to users.<br><br>Putting the image loading at the bottom of the page or even in a 'Body.onload' handler will speed up the initial display of the page. When using this technique your rollover handlers should check the state of the image downloading process and NOT perform the rollover operation if the images have not finished downloading. This will eliminate script errors that occur when a user passes the mouse over a DHTML image before the download completes.<br><br>&quot;But, that's just my opinion... I could be wrong&quot;.<br>-pete
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top