StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POjavascript variables not setting - checked via firebug
text
Body
copied!<p>I'm new to stackoverflow! </p> <p>I'm having problems with a piece of code for my companies website, using jquery. I'm trying to track the clicks on two button and set a variable/s which can then be used to determine a course of action. Basically its a sliding dropdown that animates one way if the variable is set to true and another if it is set to false. I've initiallised the variables both to be false to begin with and then through the course of clicking they should be set to true or false depending on the situation:</p> <pre><code>var boollogin = false; var boolregister = false; $(document).ready(function(){ $('#slidedownlogin').hide(); $('#details_add_area').hide(); $('#emailconfirmation').hide(); $('#register').toggle(function(){ if(boollogin == false){ $('#login_area').hide(); $('#register_area').show(); $('#details_add_area').hide(); $('#slidedownlogin').animate({'height':'235px'},1500, 'easeOutExpo'); }else{ $('#slidedownlogin').animate({'height':'0px'},1500, 'easeOutExpo',function(){ $('#login_area').hide(); $('#details_add_area').hide(); $('#register_area').show(); $('#slidedownlogin').animate({'height':'235px'},1500, 'easeOutExpo'); }); } boolregister = true; } , function(){ $('#slidedownlogin').animate({'height':'0px'},1500, 'easeOutExpo', function(){ $('#slidedownlogin').children().hide(); }); boolregister = false; boollogin = false; }); $('#login').toggle(function(){ if(boolregister == false){ $('#register_area').hide(); $('#details_add_area').hide(); $('#login_area').show(); $('#slidedownlogin').animate({'height':'220px'},1500, 'easeOutExpo'); }else{ $('#slidedownlogin').animate({'height':'0px'},1500, 'easeOutExpo',function(){ $('#register_area').hide(); $('#details_add_area').hide(); $('#login_area').show(); $('#slidedownlogin').animate({'height':'220px'},1500, 'easeOutExpo'); }); } boollogin = true; } , function(){ $('#slidedownlogin').animate({'height':'0px'},1500, 'easeOutExpo', function(){ $('#slidedownlogin').children().hide(); }); boollogin = false; boolregister= false; }); }); </code></pre> <p>The page I'm working on is at <a href="http://www.premiersoftware.co.uk/index94.php" rel="nofollow">http://www.premiersoftware.co.uk/index94.php</a>. Full code is in the php file at the moment so you can look at it there too. You should be able to get an idea of what I'm trying to do by clicking the two links (Register and Login) at the top right of the page.These are supposed to reset the variables boollogin or boolregister, but inspecting these two variables in firebug reveals they aren't being reset and don't change. As a result the page initially acts as expected but after a while and a few clicks it gets really quirky. The form valitation and stuff hasn't been done yet as I'm trying to get the animation sorted first.</p> <p>I was hoping someone here would be able to shed some light on why the variables aren't being reset and suggest how I could fix the code. If there is another way to create the same kind of functionality I'm also open to suggestion.</p> <p>Thanks in advance </p> <p>Dan</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload