SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    Pragmatic Programmer halfasleeps's Avatar
    Join Date
    Feb 2006
    Location
    Altoona, PA. USA
    Posts
    1,945
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    preloading images not working

    i am preloading my images like this:

    Code:
    <script type="text/javascript" language="javascript">
    	var Button = new Array();
    	Button[0] = new Image();
    	Button[0].src = "https://www.kranichs.com/images/starFadeUp.gif";
    	Button[1] = new Image();
    	Button[1].src = "https://www.kranichs.com/images/starDown.gif";
    	Button[2] = new Image();
    	Button[2].src = "https://www.kranichs.com/images/starUp.gif";
    	Button[3] = new Image();
    	Button[3].src = "https://www.kranichs.com/images/starFadeDown.gif";
    
    </script>
    but it still downloads it everytime. its only a 20X20px image so it still pops up in just a couple seconds but id really like it to pop up instantly

    any help would be appreciated, thanks
    Altoona Design
    Freelance Flex developer for hire.
    ActionScript Programmer with 8 Years Experience.

  2. #2
    SitePoint Enthusiast RogueJedi's Avatar
    Join Date
    Oct 2001
    Location
    Texas
    Posts
    96
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Put that code into a function that you call in the body tag's onload event and the images should preload correctly.
    Rob Nolan
    Do or do not, there is no try.

  3. #3
    SitePoint Enthusiast
    Join Date
    Aug 2005
    Posts
    26
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Preloading images can be done without javascript, with something like this in the end of your file:
    Code:
    <span id="preload">
    	<img src="https://www.kranichs.com/images/starFadeUp.gif">
    	<img src="https://www.kranichs.com/images/starDown.gif">
    	<img src="https://www.kranichs.com/images/starUp.gif">
    	<img src="https://www.kranichs.com/images/starFadeDown.gif">
    </span>
    And then put this in your css file or inside style tags:
    Code:
    #preload img{
    	width: 0px;
    	height: 0px;
    	}
    I recently found this. Why use javascript if you can do it without it?
    Last edited by maxorator; Jun 15, 2006 at 04:16.

  4. #4
    SitePoint Member
    Join Date
    Jun 2006
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    #3, exactly, i use same technic, only css hidder class differ a bit:

    Code:
    #preload img{
      display: none;
      visibilty: hidden;
    }
    And if i remember correct, this doesn't not work very well under Opera, it's as usually too smart.

  5. #5
    Pragmatic Programmer halfasleeps's Avatar
    Join Date
    Feb 2006
    Location
    Altoona, PA. USA
    Posts
    1,945
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks
    Altoona Design
    Freelance Flex developer for hire.
    ActionScript Programmer with 8 Years Experience.


Bookmarks

Posting Permissions

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