Results 1 to 4 of 4
  1. #1
    Join Date
    Mar 2004
    Tenerife, Spain

    preload rollover button images once for whole site? in HTML?

    I'm building a site where the the menu button image changes on mouseover. The images are cell backround images and the actual links are text in table cells so I actually only have 2 images as they are repeated for each button. It all works (but too slow). The gif that appears when you rollover only loads on the first time you mouseover one of the cells. Can I get them both to load first (i.e. before anything else on the page and also keep them loaded so that they don't have to load again for every page. Sounds simple but everything I've tried loads them last. Also, is it possible to do it in HTML or do I have to use javascript?


  2. #2
    Join Date
    Nov 2003
    i not know the code but it possible using javascript.

  3. #3
    Join Date
    Mar 2004
    do a search on free java script sites most of these have tons of them.

  4. #4
    Join Date
    Jan 2003
    Houston, TX - Originally from UK
    You don't have to rely on javascript to accomplish this. It can be done using CSS.

    What you do is a bit more complicated, but works, at least on my site (take a look to see what I mean - the packages graphics work in the way I'm about to describe)

    You have a link - for example to Home. Create one graphic that contains each state you'd like to have in your link. If you wanted normal and hover (like on my site) you'd have two graphics stacked on top of each other within the same image

    Here's the clever bit. As it's a normal graphic it gets loaded, and then remains in cache. We then use CSS to display the hover part of the graphic as and when we want it:

    #home a {
    background:url(/images/home.gif) no-repeat top left;
    #home a:hover {
    background-position:0 -20px;
    What that does is move the graphic up by 20 pixels to show the hover state when the mouse hovers over. When the mouse moves away, the graphic moves back to its former position.

    I know this isn't very clear. Take a look at my site and you'll see it's easier to do than explain!
    Kinkamono Internet Services - The Internet. Done Right.
    Dive In...

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts