[Javascript] Monitor an offsetHeight value

Paul Novitski paul at juniperwebcraft.com
Mon Jan 15 11:15:59 CST 2007


At 1/15/2007 06:52 AM, Guillaume wrote:
>Here's my function below re-aranged according to your replies...
>I still don't understand why, when checkOptSli() is called, I always 
>get the else statement... Not being able
>to compare an initial value to a listened one...

...

>function checkOptSli() { // This is fired when a user clicks a link
>
>  var sto2 = 0;

Why are you setting this variable?  You don't use it for anything and 
because it's local it can't be used anywhere else in your script.


>sto2ID = setTimeout("checkOptJ();", 2000);

This sets sto2ID equal to the setTimeout() id, but it is a pointless 
assignment statement because sto2ID is never used again inside this 
function and being local it cannot be used anywhere else (although 
you attempt to do so).

Your script suggests that you believe setTimeout("checkOptJ();", 
2000); will return the result of function checkOptJ(), however 
according to the manual setTimeout() returns "the ID of the timeout, 
which can be used with window.clearTimeout."
http://developer.mozilla.org/en/docs/DOM:window.setTimeout


>}
>
>function checkOptJ() {
>
>    var optsh0 = checkOptK;

This statement sets optsh0 equal to the TEXT of function 
checkOptK().  Probably what you want is:

         var optsh0 = checkOptK();

to get the RETURN VALUE from function checkOptK().  See:
http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Guide:Defining_Functions


>    optsh3 = optsh0;// Initial value (offsetHeight) of element

No, this sets optsh3 equal to the TEXT of function 
checkOptK().  Display its value with alert() to see what I mean.


>    var optsh1 = 0;

This is a pointless assignment statement since you do not use optsh1 
again within this function and, being local, it cannot be used anywhere else.


>    var optsh1ID = setTimeout("checkOptL();", 2000);

Again this sets optsh1ID equal to the ID of this setTimeout() call, a 
value that is really only useful to clearTimeout().


>    optsh4 = optsh1ID;// Value to be listened to and compared to the 
> previous one above

What's your purpose in passing the setTimeout() ID from one variable 
to another?


>          if ( optsh4 > optsh3 ) {

This compares the id of the previous setTimeout() call to the text of 
function checkOptK(), a nonsense comparison.

You need to rewrite your code to return the changing heights of your elements.



>              alert( "things have moved" );
>            }
>          else {
>          alert( "quiet" );
>            }
>}
>
>
>
>   function checkOptK(){ // Fired on the onload so we have a value 
> as starting point
>
>      var opts1 = document.getElementById("options");
>
>      moveBy1 = opts1.offsetHeight;
>
>      posTn3 = 0 - moveBy1;
>      parseInt( posTn3 );

parseInt() is a function that returns a value.  It does not affect 
the value passed to it.  You probably mean:

         posTn3 = parseInt( posTn3 );

http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Guide:Predefined_Functions:parseInt_and_parseFloat_Functions



>      return posTn3;
>
>      }
>
>  function checkOptL(){ // Looped inside a setTimeout to see if this 
> value is changing...                        // And compare it 
> inside the checkOptJ()function to the checkOptK()resulting value
>
>      var opts2 = document.getElementById("options");
>
>      moveBy2 = opts2.offsetHeight;
>
>      posTn4 = 0 - moveBy2;
>
>      parseInt( posTn4 );
>
>      return posTn4;
>
>      }

checkOptK() and checkOptL() performs identical functions -- you can 
make them a single function called from two different places in your code.


Guillaume, I strongly suggest that you read the JavaScript and DOM 
documentation, and also that you use alert() to display values of 
your variables as you go along to help you debug your code.  It seems 
clear from your code that you need to strengthen your understanding 
of basic JavaScript syntax.

Core JavaScript 1.5 Guide
http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Guide

Gecko DOM Reference
http://developer.mozilla.org/en/docs/Gecko_DOM_Reference


Regards,
Paul
__________________________

Juniper Webcraft Ltd.
http://juniperwebcraft.com




More information about the Javascript mailing list