Jump to content

Very Confused - What's Wrong With This Function?


IAmBill

Recommended Posts

function flash(obj) {	if (flash.called) {		if (flash.obj.style.opacity == 1) {			flash.called = false;		}		else {			flash.obj.style.opacity += 0.01;			setTimeout("flash()", 1);		}	}	else {		flash.called = true;		flash.obj = obj;		flash.obj.style.opacity = 0;		setTimeout("flash()", 1);	}}

Granted it's late at night and I'm tired, but I can't for the life of me figure out why this function doesn't work. I removed the debug messages, but the basic gist is this... the statement "flash.obj.style.opacity += 0.01;" only works once... that is to say, the function is called with an object. It goes to the first else, sets the internal variable to the parameter object, the opacity is sucessfully set to 0, and the timeout is set. The timeout happens, the first condition succeeds, it goes to the second else, opacity is successfully incremented to 0.01. The timeout is set again, it happens again, goes the second else, again... now, at this point, if checked the opacity is still 0.01 before the call, so all of the variables remained intact between calls. This time, however, after the statement "flash.obj.style.opacity += 0.01;" the opacity is still 0.01 rather than 0.02 as it should be. I mean, I literally have these alerts in the function:

alert("Before: " + flash.obj.className + " - " + flash.obj.style.opacity);flash.obj.style.opacity = flash.obj.style.opacity + 0.1;alert("After: " + flash.obj.className + " - " + flash.obj.style.opacity);

...and they tell me the opacity is 0.01 in both of them. What's the deal? Why would the increment statement work on the first call but not on subsequent calls?

Link to comment
Share on other sites

Do you have a link to your page? And what is flash anyway?
Unfortunately, I'm running this locally on WAMP server. You can however test it in any one of W3schools Tryit Editor pages by using this code below.
<html><body><script type="text/javascript">function flash(obj) {	if (flash.called) {		if (flash.obj.style.opacity == 1) {			flash.called = false;		}		else {			flash.obj.style.opacity += 0.1;			setTimeout("flash()", 1);		}	}	else {		flash.called = true;		flash.obj = obj;		flash.obj.style.opacity = 0;		setTimeout("flash()", 1);	}}</script><span style="border:1px solid black" onclick="flash(this)">CLICK ME TO FLASH!</span></body></html>

The flash function is simply supposed to make an element blink from completely transparent to full opacity over the course of a second. The function works just fine other than that fact that, for some reason, the increment statement doesn't seem to be incrementing past the value of the right-side argument.

Link to comment
Share on other sites

Ah, I found the answer, the problem was that there were an implicit conversion of float to string on the assignment to opacity.So:opacity = 0 = "0"opacity += 0.1 = "00.1" = "0.1"opacity += 0.1 = "0.10.1" = invalid dataMakes sense... sorry for the stupid question.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...