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!

How to load logo before rest of site displays

Status
Not open for further replies.

djcheeky

Programmer
Jun 7, 2002
3
ZA
Hi there.

I'm looking for a way to load my webpages' main logo before the rest of the tables and text load. Usually, the text and links and all load first, and then the page loads the images and logos. I want the logo at the top to load first before anything else.

Javascript preloading doesnt help in this case, so if anyone else has any ideas i'd really appreciate it.

mail: cheekyproductions2001@yahoo.com or post reply

Thanks a mill.
 
I'm afraid I have no true clue. However I can think of a mundane stupid, worthless, what other choice you got solution. There are other sites that I have seen that take you to one page and then wait for a certain amount of time before redirecting you to the page you want to go to. So you could have the page I'm guessing the index page in this case, with only the logo on it, then have it redirect you after a little bit, five seconds should be enough, to the real index page, you could call it index2.htm. Like I said probably not what you were looking for, but it's the best I could come up with. John 3:15-16 God bless and Christ be with you.
 
The JS preloading doesn't work?? What kind of script did you use?? Try another one, from what I know a preloading images script will load the images first then the rest of the site...
Another solution is try lowering the image's size, maybe a logo with a huge size takes a while to load... I have not failed; I have merely found 100,000 different ways of not succeding...
 
Position your logo absolutely (not required but a little faster). Then set everything else to visibility: hidden or display: none in your CSS. Lastly, show the hidden content onload.

The logo will show imediately after downloading and everything else will show when the browser is finished downloading the page.

Of course to do this you'll need more than 1 CSS so JS disabled browsers will show the content. Put this in JS tags in the head and after the link to the first style sheet:

document.write('<link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;JsEnabled.css&quot;>')
 
Something like this in the header &quot;should&quot; work, I'm not sure why it wouldn't (it works for me, is your image huge?)...

var myimages=new Array();
function preloadimages(){
for (i=0;i<preloadimages.arguments.length;i++) {
myimages= new Image();
myimages.src=preloadimages.arguments;
}
}
preloadimages(&quot;/$imagepath/$image1.gif&quot;

But I'm guessing you've tried this or something similar

Joe.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top