View Full Version : Picture fading into home page?

07-02-2007, 09:34 PM
Probably not the right section to post this at all, so please excuse me.

Does anyone know if there’s a way that, once a URL is opened, a full page jpg (or whatever) picture can start, as a title page, and then dissolve/fade into the actual home page after a few seconds?

Hope this makes sense to someone??

Thanks in advance

07-06-2007, 03:38 PM
Do you use Windows?

Moderator Edit: Stay on topic.

07-09-2007, 04:12 PM
Yes, for now. Thinking of defecting to Linux though.

07-09-2007, 08:27 PM
How does that have anything to do with the question asked, techno_race?

As for the question, I'm not exactly sure how to do this.

Basically, you could set an image, or even a div with an image in it, to fill the entire screen (using some CSS, probably the float property). Set it to visible, and it's z-index to place it above the rest of the content. Then fade the image, and set the visibility to hidden.
Fading the image can be accomplished by a loop of changing the opacity, one step at a time, something like 10%, perhaps, depending on how fast/smoothly the script needs to run.

You might be able to borrow from some scripts for this, such as the lightbox script, but set it onLoad and then, after a timer expires, to fade. That might be the easiest option.

07-09-2007, 09:09 PM
I think t_race was getting at the fact that in IE you can blend trans an entire page into another. The first page could have only the image and a meta timed redirect backed up javascript replace timer on it.

In any case, however it is done, loading up such a large image - if it is large in byte load, say 80k or more as a full screen image might well be, isn't a very good idea.

07-09-2007, 10:51 PM
oooo Very Interesting stuff man. Hold On i might just have what your looking for...
I gotta go into the folders in my computer, look for it... won't take long

07-09-2007, 10:56 PM
If you download Macromedia Dreamweaver CS3 you will be able to do something like that.
But one question...
When the jpg fades/dissolves will the page switch to the index or do you want the content underneath to show, like the image is one layer and the page is another, the image sits ontop and then fades and the page is revealed?

btw heres the link to the Dreamweaver CS3 Download...
Its really big and your gonna need to install it, but its worth it...
You get it free for 30 days

07-11-2007, 07:43 PM
You're right; it is big. I've downloaded it though. Thanks for the link.

07-24-2007, 01:50 PM
Sorry, Rockonmetal, I was too busy playing with Dreamweaver to notice your question . . .

Yeah, ideally, I’d like the image to be solid, and as it fades, for the index page to show through until only the index page is visible. If that makes sense??

07-24-2007, 02:12 PM
With minor configuration and used as an onload event, this script would work to do that:


However, as I said before, loading up a large image (fading or not) is not such a good idea for folks with dial up or for those times when band-width dips.

07-24-2007, 03:03 PM
OK, point taken. I’d like to achieve this for my own personal benefit though, even if I never use it online. Thanks for your help and advice.