Javascript popup and close
<p>HTML</p>

<pre><code>&lt;ul&gt;
    &lt;li class="first"&gt;&lt;a href="#"&gt;Intro&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="#"&gt;Crew&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>CSS</p>

<pre><code>.page-popup {
    z-index:500;
    position:absolute;
    left:345px;
    background:#fff;
    width:680px;
    height:325px;
    top:175px;
    display:none;
}
</code></pre>

<p>JavaScript:</p>

<pre><code>$('.first').click(function() {
    var onOff=false;

    if (onOff=false) {  
        $('.page-popup').fadeIn('slow', function() {
            // Animation complete
        });
        onOff = true;
    } else {
        $('.page-popup').fadeOut('slow', function() {

        }); 
        onOff = false;
    }
});
</code></pre>

<p>I am trying to create an open close popup effect. When they click on the link the popup fades in, when I click on the link again the popup fades out.</p>

<p>*UPDATED. I have figured out how to make it work. I must place the declare:</p>

<pre><code>var onOff=false;
</code></pre>

<p>at page load not when the onclick is executing otherwise it always resets it.......and of course using == for comparison :)</p>
