Question

I am using this vTicker script. It uses an li to scroll the items and there are also Previous and Next buttons. I want to mod the jQuery to say if there is only one li do not scroll and hide the buttons.

<div id="scroller">
    <ul id="list">
        <li>Test 1</li>
        <li>Test 2</li>
        <li>Test 3</li>
        <li>Test 4</li>
        <li>Test 5</li>
    </ul>
</div>
<a class="Prev" href="#">Prev</a>
<a class="Next" href="#">Next</a>

Jquery:

$(function(){
    var $scroller = $("#jqscroller");
    $scroller.vTicker('init', {height: 20, showItems: 1});

    $(".next").click(function(){ 
        $scroller.vTicker('next');
    });

    $(".prev, .next").hover(function(){ 
        $scroller.vTicker('pause', true);
    }, function(){
        $scroller.vTicker('pause', false);
    });

    $(".prev").click(function(){ 
        $scroller.vTicker('prev');
    });
});

So is there a way to only call the function if li is greater than 1 and add a css class to the buttons so I can display:none them?

Answer 1

You can do like this:

if ($('#list li').length === 1) {
   $('.Prev, .Next').hide();
}