jQuery - Several functions on one element
<p>Im currently developing a wordpress site for a client, and they want to have a scroller which disapears from the click of a button and then shows content in a modal window blah blah blah ... It seems to all work, except when i put it all together when i click on a li element, it just displays the link in the address bar and doesnt go anywhere ... i have a feeling its got to do with disabling the normal function of a href but i wasnt sure how to get around it.</p>

<p>So for the scroller i have the following structure</p>

<pre><code>&lt;div class="scrollerone"&gt;
    &lt;ul&gt;
        &lt;li&gt;&lt;a href=""&gt;&lt;img src="image.jpg" /&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href=""&gt;&lt;img src="image.jpg" /&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href=""&gt;&lt;img src="image.jpg" /&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href=""&gt;&lt;img src="image.jpg" /&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href=""&gt;&lt;img src="image.jpg" /&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href=""&gt;&lt;img src="image.jpg" /&gt;&lt;/a&gt;&lt;/li&gt;
        &lt;li&gt;&lt;a href=""&gt;&lt;img src="image.jpg" /&gt;&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;
</code></pre>

<p>The jQuery code i have is as follows ....</p>

<pre><code>&lt;script type="text/javascript"&gt;
    jQuery(function() {
        jQuery(".scrollerone").jCarouselLite({
            btnNext: "#btnnext1",
            btnPrev: "#btnprev1"
        });
    });
&lt;/script&gt;

&lt;script type="text/javascript"&gt;
    jQuery(function(){
        var list = jQuery('.scrollerone');
        var original_height = list.height();
        var new_height = '0';
        list.css({height:new_height});

        jQuery('#refl').click(function() {

            if(list.height() == original_height){
                jQuery('.viewcs').html('VIEW ALL CASE STUDIES');                                    
                list.animate({height:new_height});
            } else {
                list.animate({height:original_height});
                jQuery('.viewcs').html('CLOSE ALL CASE STUDIES');
            }
            return false;
        });
    });
&lt;/script&gt;
</code></pre>

<p>If anyone could shed some light on this, that would be great ... I have a feeling that the return false bit disables the usual click behaviour, but it shouldnt affect the clicking on the li elements in the scroller should it?</p>

<p>Cheers,</p>
