Jump to content
Sign in to follow this  
IAmBill

Very Confused - What's Wrong With This Function?

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?

Edited by IAmBill

Share this post


Link to post
Share on other sites

Do you have a link to your page? And what is flash anyway?

Share this post


Link to post
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.

Edited by IAmBill

Share this post


Link to post
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.

Edited by IAmBill

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...