jquery - if ステートメントが機能しない (px 左) jQuery

Question

私はかなり単純な jQuery スライダーに取り組んでいます。しかし、私はブロックを打っています（まあ、いくつか）。これをできる限りシンプルに保つようにしています。私は jsFiddle を持っています: http://jsfiddle.net/dXYCP/

jsFiddle には、左の状態で de div #slider_ul の px が 0 以下の場合、矢印ボタンを非表示にする if ステートメントがあります。しかし、うまくいきません。

Answer 1

使用してみてくださいposition()（またはoffset()、マークアップに依存します）：

if ($('#slider_ul').position().left > 0) { ... }

Answer 2

このデモリンクhttp://jsfiddle.net/dXYCP/7/のようにスライダーが必要だと思います

JS:

 $(function() {

    slider();

    $('.arrow_left').click(function() {
       $('#slider_ul').animate({
            'left': '+=470px'
        }, slider);
    });

    $('.arrow_right').click(function() {        
        $('#slider_ul').animate({
            'left': '-=470px'
        }, slider);
    });

    function slider (){        
        var sliderPos = parseInt($('#slider_ul').css('left'), 10);
        if (sliderPos < 0) {
            $('.arrow_left').css('visibility', 'visible');
        } else {
            $('.arrow_left').css('visibility', 'hidden');
        }

        if (sliderPos < (-470*2)) {
            $('.arrow_right').css('visibility', 'hidden');
        } else {
            $('.arrow_right').css('visibility', 'visible');
        }
    };

});

CSS:

.arrow_left{
    margin-top:40px;
    float:left;
    margin-right:50px;
    cursor: pointer;
}

.arrow_right{
    margin-top:40px;
    float:right;
    margin-left:20px;
    cursor: pointer;
}

#slider{
    padding-top:15px;
    float:left;
    width: 470px;
    overflow: hidden;
}