web page fade

[tetrix]

hi,

is it possible to build those kind of fade in dhtml?(the fade when the page loads):
http://www.saturday-london.com/ (flash site)

[boogyman]

Yes, but I wouldn't recommend it.

It would need to be done entirely with AJAX, or use of frames, however this would prevent a user from ever being able to bookmark anything other than the initial home page.

[tetrix]

there's is no need of ajax nor frames this can be simply done with document.bgColor and onload event

[Twey]

onload = function() {
  var s = document.body.style;
  if(parseInt((s.backgroundColor = "#" + (parseInt((s.backgroundColor || "#000000").substr(1)).toString(16) + 0x111111).toString(16)).substr(1), 16) < 0x777777)
    setTimeout(onload, 50);
};

boogyman, I think tetrix was just talking about the initial fade effect, not having all the pages crushed into one file like on that site.

[MugzMalone]

I have been searching and searching. I am looking for some simple copy / paste code that will cause the pages to fade in transition across browsers. It can be done in IE with this:

<meta http-equiv="Page-Enter" content="blendtrans(duration=1.0)">
<meta http-equiv="Page-Exit" content="blendtrans(duration=1.0)">

Is there a code which will create the same effect in Mozilla, as well? If so, where should it be placed in the document?

[johnywhy]

hi twey

smart post! i really appreciate coders who find the simplest, cross-browser solution, without getting too fancy. good job!

how about the following:

i want to put similar code on a page containing an iFrame. i want each new page inside the iFrame to fade in, and the previous page to fade out. i have no control over the iFrame pages, only the parent page. i want to do this as simply as possible.

looking forward to your smart answer!

-johny

[Twey]

If the pages inside the iframes are on different domains, you're out of luck: it's impossible to manipulate pages over different domains for security reasons.

[johnywhy]

• Doesn't the iFrame raise events accessible to the parent page, such as onload?
• Doesn't the parent page have control over external iFrame properties, such as opacity?
• My browser is rendering the contents of the iFrame-- therefor, won't my browser have some control over how it renders it?

[Twey]

Yes (although that's the only example), no (effectively), and no.

[jscheuer1]

onload = function() {
  var s = document.body.style;
  if(parseInt((s.backgroundColor = "#" + (parseInt((s.backgroundColor || "#000000").substr(1)).toString(16) + 0x111111).toString(16)).substr(1), 16) < 0x777777)
    setTimeout(onload, 50);
};

I don't get it, and/or it doesn't work.

Warning: Expected color but found '#01118481'. Error in parsing value for property 'background-color'. Declaration dropped.
Source File: [some file with that code on it]
Line: 0