Register | Login
BootSkins XP
Cursor FX
Dream
Icon Packager
LogonStudio XP
LogonStudio
Object Dock
Sound Schemes
Suites
WallPapers
WindowBlinds
All

Search
Forum Home | Login
We have re-enabled logins for the forums, please be aware that you may need to reset your password or register for an account again while we continue to restore full functionality.
Styl-X Design
Styl-X Design
Join Date 05/2002
0

So, any advanced javascript coders here?

August 13, 2004 6:23:18 PM from WinCustomize ForumsWinCustomize Forums
Ok, I was thinking. (It rare but well... you know, **** happens )

I wrote a small script to preload images for my website.
All my images are in the same map (www.styl-x.com) /images
Now I was wondering, instead of having 30 lines of code for each single image, isn't it possible to replace all those lines and have one line preloading "/image" instead of
/images/background.jpg
/images/button.jpg
/images/buttonover.jpg.... (you get the idea )

thanks.
Locked Post
Search this post
Advanced Search
Subscription Options
Reason for Karma (Optional)
Successfully updated karma reason!
Styl-X Design
paxx
Join Date 03/2001
0
Reply #1 August 13, 2004 8:32:07 PM
from WinCustomize ForumsWinCustomize Forums

I don't think so, but you can preload all your images in your single script, instead of repeating the script for every image. Or you can write the script in a function and call the function on every image, but the first way is better. But then again, I don't know the context exactly.

Reason for Karma (Optional)
Successfully updated karma reason!
Styl-X Design
paxx
Join Date 03/2001
0
Reply #2 August 13, 2004 9:35:59 PM
from WinCustomize ForumsWinCustomize Forums

Maybe you mean that your script has 30 lines, and you want to know if there is a way to reduce it to two lines?
If that's the case, I don't think so. It's about two lines per image, and as far as I know you have to write it for every image:

if (document.images)
{
  pic1= new Image()
  pic1.src="//someplace.com/image1.gif"

  pic2= new Image()
  pic2.src="//someplace.com/image2.gif"

  pic3= new Image()
  pic3.src="//someplace.com/image3.gif"

  (and so on for every image)
 
}

BTW: you could do without the IF statement. It's there for older browsers that don't support the image object. If you leave it out, older browsers will get a javascript error.


[Message Edited]
Reason for Karma (Optional)
Successfully updated karma reason!
Styl-X Design
Kevin_C
Join Date 11/2002
+7
Reply #3 August 13, 2004 9:53:12 PM
from WinCustomize ForumsWinCustomize Forums
well, I've not done any image preloading in a while but if you don't need to re-use the image objects you can create an array with all of your image names like so:

var myArray = new Array("image1.jpg", :image2.jpg", "image3.jpg", etc...)^

Then, you can have a function loop through the array loading each image as it goes:

for(var i = 0^ i < myArray.length^ i++) {
var tPic = new Image()^
tPic.src = "http://yoururl.com/images/" + myArray[i]^
}

This basically accomplishes the same thing as Paxx's code but the image object is re-initialized each time through the loop. Since the purpose of pre-loading is only to get the browser to load the images at the beginning of page load this should do what you need.. Hope this helps!

Since semi-colons get stripped in posts you'll need to replace the carat's (^) with semi-colons..
[Message Edited]
Reason for Karma (Optional)
Successfully updated karma reason!

Sign Up or Login and this ad disappears!
There are many great features available to you once you register. Sign Up for a free account and browse the forums without ads.

Styl-X Design
paxx
Join Date 03/2001
0
Reply #4 August 13, 2004 10:01:29 PM
from WinCustomize ForumsWinCustomize Forums
f0r3 has a good idea, but in my example image1.gif, image2.gif, image3.gif were only examples of what your images could be called.  For f0r3's code to work, your images would actually need to be named sequentially like that. If you don't mind renaming your images that way, then yes, you can save a lot of codinglines with the above, especially if you got hundreds of images.
Reason for Karma (Optional)
Successfully updated karma reason!
Styl-X Design
Styl-X Design
Join Date 05/2002
0
Reply #5 August 14, 2004 6:59:42 AM
from WinCustomize ForumsWinCustomize Forums
looks good, let me check it out. Well, it aren't hundreds of images but my webpage just has about 30 images (2-3 KB Most of them). I am hosting my server myself and just want to speed things up as it will take about 5 seconds to load my page now.
Reason for Karma (Optional)
Successfully updated karma reason!
Styl-X Design
Kevin_C
Join Date 11/2002
+7
Reply #6 August 14, 2004 7:15:43 AM
from WinCustomize ForumsWinCustomize Forums
actually, they wouldn't need to be named anything special.. The only requirement would be that the names be in the array. I was simply following your naming convention but the code will work with an array like:

myArray = new Array("bob.jpg", "jane.jpg", "bill.jpg", "bluesky.jpg")

This would cause each image to be loaded one after the other.
Reason for Karma (Optional)
Successfully updated karma reason!
Styl-X Design
paxx
Join Date 03/2001
0
Reply #7 August 14, 2004 9:43:40 AM
from WinCustomize ForumsWinCustomize Forums
Oh yeah, true enough. I looked too quickly. I thought the name of the image was in the loop, like "image"+ i +".gif" or something. Well, that's another way of doing it, but that time your image name definately would need to be sequential.
Reason for Karma (Optional)
Successfully updated karma reason!
Styl-X Design
Styl-X Design
Join Date 05/2002
0
Reply #8 August 14, 2004 9:58:48 AM
from WinCustomize ForumsWinCustomize Forums
Looks good tought, thanks for the help, I appreciate it.
Reason for Karma (Optional)
Successfully updated karma reason!
View all recent posts
Mark all posts as read Delete cookies created by the forum Return to Top
Stardock Forums v        Server Load Time:   Page Render Time:


Home | About | Privacy | Upload Guidelines | Terms of Service | Help
WinCustomize © 2025 Stardock. All Rights Reserved.