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!

Register Log in
  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Page change with "Fade" 1

Status
Not open for further replies.
graphicgirl

graphicgirl

Technical User
Mar 16, 2001
65
US
Hi everyone!
I have noticed a couple of sites that I've been to that when you click to go to another page, it will "fade" into the other page, or "Disolve" into the next page - does anyone know how they do that? I also heard that it slows down the site... any comments?
 
Sort by date Sort by votes
This is similar - and pretty cool by the way - the ones that I've seen are a little more subtle, and do it as you navigate the site. How would I use the ones from this site... Just copy and past the code in???
 
Upvote 0 Downvote
Not very helpful but anyway...

I know that it's done with Styles. And FrontPage can do this easily. I don't know what style it uses exactly but I think this is something Internet Explorer specific, it won't work with other browsers. So if this is very interesting for you - browse the web and post the example here :)

But as I know people usually don't like it, even hate it :( So I personally never use it... Good Luck! :)
 
Upvote 0 Downvote
I word of advise ... stay away from Front page......!

This is how you implement the java script on your page:

cut the following code and paste it inside the <head> tag

<SCRIPT LANGUAGE=&quot;JavaScript&quot;>
<!--
// convert decimal value (0 - 255) to hexadecimal
// (use .toString(16) method supported by IE)
function toHex(dec) {
// create list of hex characters
var hexCharacters = &quot;0123456789ABCDEF&quot;
// if number is out of range return limit
if (dec < 0)


return &quot;00&quot;
if (dec > 255)
return &quot;FF&quot;
// decimal equivalent of first hex character in converted number
var i = Math.floor(dec / 16)





// decimal equivalent of second hex character in converted number


var j = dec % 16





// return hexadecimal equivalent


return hexCharacters.charAt(i) + hexCharacters.charAt(j)


}


// set background color to specified descriptors


function setbgColor(red, green, blue) {


document.bgColor = &quot;#&quot; + toHex(red) + toHex(green) +
toHex(blue)


}


// fade from start to end descriptors (increase step to increase transition speed)


function fade(sred, sgreen, sblue, ered, egreen, eblue, step) {


// loop to create fade effect


for(var i = 0; i <= step; ++i) {


// set current red descriptor


var red = Math.floor(sred * ((step - i) / step) + ered
* (i / step))





// set current green descriptor


var green = Math.floor(sgreen * ((step - i) / step) +
egreen * (i / step))





// set current green descriptor


var blue = Math.floor(sblue * ((step - i) / step) +
eblue * (i / step))



// set background color according to descriptors
setbgColor(red, green, blue)
}
}
// -->
</SCRIPT>


Next.... put the following code inside your <body> tag

onLoad=&quot;fade(0, 0, 0, 255, 255, 255, 64)&quot; onUnload=&quot;fade(255, 255, 255, 0, 0, 0, 64)&quot;

that should do it.... now .. notice the first three numbers are RGB descriptions of the color the fade starts (0,0,0 = black and 255,255,255 = white) you can change the colors of the fade to anything you want.... you can use photoshop to find out the RGB color code.

Later gators... :)
Dumboy.! Ouch.! .my brain.....
spiderdesign@yahoo.com

It's hard to think with only one neuron......Ouch.....!....it hurts when I think......!
 
Upvote 0 Downvote
stay away from this...its just gimmiky and I and many others hate it...if ppl want to see a powerpoint presentation they wont go online to do so....plus in my opinion it just looks cheap [rockband]
whos that behind you?
 
Upvote 0 Downvote
I absolutely agree with that..... it looks cheap!

nevertheless, that's how you do it. :)
Dumboy.! Ouch.! .my brain.....
spiderdesign@yahoo.com

It's hard to think with only one neuron......Ouch.....!....it hurts when I think......!
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

cohan123
  • Locked
  • Question
page layout-&gt;page size, optimal for web
Replies
0
Views
214
cohan123
cohan123
FALCONSEYE
  • Locked
  • Question
ColdFusion microservices with REST
Replies
0
Views
213
FALCONSEYE
FALCONSEYE
mdvp
  • Locked
  • Question
Intermittent X-ref problem with figures in FM 12
Replies
0
Views
198
mdvp
mdvp
ElizaShteto
  • Locked
  • Question
Split One Page in two separate Pages in Framemaker 11
Replies
0
Views
79
ElizaShteto
ElizaShteto
oshinwa
  • Locked
  • Question
Which Call collector should I use and which one is compatible with my Ericsson BP250?
Replies
0
Views
205
oshinwa
oshinwa

Part and Inventory Search

Sponsor

Back
Top