...

View Full Version : problem with fade toggle



subhailc
01-12-2004, 06:20 AM
hi - the following script works fine except that when the "link" (not really a link, a span of type that triggers on onclick fade) is clicked before the transition is finished playing, freezes the visibility. however, i accidentally found out that clicking the other span quickly will start the opposing fade (which is what i want). i assume it has something to do with the .stop but i haven't been able to correct it myself. any help would be greatly appreciated.

<HTML>
<HEAD>
</HEAD>

<BODY>
<SPAN ID="CL1" onclick="curObj = I1; toggle()">CL1</SPAN>
<SPAN ID="CL2" onclick="curObj = I2; toggle()">CL2</SPAN>

<DIV ID="I1" STYLE="visibility: hidden; width: 100%; filter:blendTrans(duration=1)">i1</DIV>

<DIV ID="I2" STYLE="visibility: hidden; width: 100%; filter:blendTrans(duration=1)">i2</DIV>

<SCRIPT LANGUAGE="JavaScript">
var curObj;
function toggle() {
if (curObj.filters(0).status == 2) {
curObj.filters(0).Stop();
if (curObj.style.visibility == "hidden")
curObj.style.visibility = "visible";
else
curObj.style.visibility = "hidden";
window.setTimeout("toggle()", 1);
}
curObj.filters(0).Apply();
if (curObj.style.visibility == "hidden")
curObj.style.visibility = "visible";
else
curObj.style.visibility = "hidden";
curObj.filters(0).Play();
}

</SCRIPT>
</BODY>
</HTML>

subhailc
01-12-2004, 10:32 AM
bump :)

Willy Duitt
01-12-2004, 10:37 AM
Originally posted by subhailc
bump :)

A little impatient. :rolleyes:

Roy Sinclair
01-12-2004, 05:16 PM
Try this simplified code:



<HTML>
<HEAD>
</HEAD>

<BODY>
<SPAN ID="CL1" onclick="toggle(getElementById('I1'))">CL1</SPAN>
<SPAN ID="CL2" onclick="toggle(getElementById('I2'))">CL2</SPAN>

<DIV ID="I1" STYLE="visibility: hidden; width: 100%; filter:blendTrans(duration=1)">i1</DIV>

<DIV ID="I2" STYLE="visibility: hidden; width: 100%; filter:blendTrans(duration=1)">i2</DIV>

<SCRIPT LANGUAGE="JavaScript">
function toggle(curObj) {
if (curObj.filters(0).status == 2) {
curObj.filters(0).Stop();
if (curObj.style.visibility == "hidden")
curObj.style.visibility = "visible";
else
curObj.style.visibility = "hidden";
window.setTimeout("toggle()", 1);
}
curObj.filters(0).Apply();
if (curObj.style.visibility == "hidden")
curObj.style.visibility = "visible";
else
curObj.style.visibility = "hidden";
curObj.filters(0).Play();
}

</SCRIPT>
</BODY>
</HTML>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum