Jquery Scroller needs to stop scrolling after reaching end

Question

Iam using a scroller in one of my website. When i click the down arrow to scroll the scroller to the end, 10:00 PM reached. Again if i clicked down arrow, the scroller again moves up and whole content disappears. I want to stop the down arrow's working if the end time [Here 10:00 PM] reached.

Same problem occurs in case clicking of up arrow. We tried to solve this but didn't succeed.

Jsfiddle link: http://jsfiddle.net/Xh59R/3/

Image attatched.

Thanks in advance.

Answer 1

Check the following jsfiddle link... http://jsfiddle.net/Xh59R/8/

For next button click..

$scrollerNextButton.click(function(e){

//PUT THESE AT END
var divMargnTop=parseInt(document.getElementById("DemoShowHide").style.top);
var divMaxTopAllowed=parseInt(-1600);
if(divMargnTop<=divMaxTopAllowed)
{
$scrollerNextButton.stop().hide("fast");
}
});

For prev button click..

var divMinMargnTop=parseInt(document.getElementById("DemoShowHide").style.top);
var divMinMaxTopAllowed=parseInt(0);
if(divMinMargnTop>=divMinMaxTopAllowed)
{
    $scrollerPrevButton.stop().hide("fast");
}

http://jsfiddle.net/Xh59R/8/

Answer 2

I think you could use something like this:

$scrollerNextButton.click(function (e) {
    var lines = $("div[style*='width:100%']");
    var total = lines.outerHeight(true) * lines.length;
    if ($scroller.position().top > total) {
        $scrollerNextButton.stop().hide("fast");
    }
});