Can you do this? [Archive] - WebDeveloper.com

PDA

Click to See Complete Forum and Search --> : Can you do this?

Schitty

12-07-2005, 01:12 PM

can you make your text fade from the center of your webpage after you click a link???

drhowarddrfine

12-07-2005, 05:38 PM

Yes, using javascript. You can google for it.

TheBearMay

12-08-2005, 09:49 AM

If we were talking about images there's a shorter way, but IE doesn't like to fade text directly. This should work no matter what the div contains.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript">
/*<![CDATA [*/
fadeVal=100;
function fadeDiv(divName){
document.getElementById(divName).className="opaque"+fadeVal;
fadeVal-=5;
if(fadeVal > 0) setTimeout("fadeDiv('"+divName+"')",50);
}
/*]]>*/
</script>
<style type="text/css">

</style>
</head>

<body>

<div id="fadeMe" onclick="fadeDiv(this.id)" >
Just some random text.
</div>

</body>
</html>

Schitty

12-08-2005, 12:13 PM

thanks dude but i need the text to fade in after clicking a link

TheBearMay

12-08-2005, 02:34 PM

Simple matter of changing the decrement to an increment:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript">
/*<![CDATA [*/
fadeVal=0;
function fadeDiv(divName){
document.getElementById(divName).className="opaque"+fadeVal;
fadeVal+=5;
if(fadeVal < 100) setTimeout("fadeDiv('"+divName+"')",50);
}
/*]]>*/
</script>
<style type="text/css">

</style>
</head>

<body>

<div id="fadeMe" >
Just some random text.
</div>
<button onclick="fadeDiv('fadeMe')">Show Text</button>

</body>
</html>