如果语句不起作用（左像素）jQuery [关闭]

Posted 2023-05-08

【中文标题】如果语句不起作用（左像素）jQuery [关闭]

【英文标题】：If statement not working (px left) jQuery [closed]

【发布时间】：2012-08-30 07:17:33

【问题描述】：

我正在开发一个相当简单的 jQuery 滑块。但我遇到了一个障碍（好几个）。我尽量保持简单。我有一个 jsFiddle：http://jsfiddle.net/dXYCP/

在 jsFiddle 中，我有一个 if 语句，当 de div #slider_ul 左侧​​条件为 0 或更少 px 时，它应该隐藏箭头按钮。但它不起作用。

【问题讨论】：

滑块函数调用在哪里？

它不起作用，因为您的带有'#slider_ul'.left 的if 语句应该是$('#slider_ul').left()

jsfiddle 什么都不懂，真的。

@Vega 我猜这是animate 的处理程序。但是，即使使用正确的语法和代码，按钮也不会隐藏。演示中有一些逻辑错误。

【参考方案1】：

尝试使用position()（或offset()，取决于标记）：

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

【讨论】：

@SnakeEyes 是的，我也想过。谢谢！

【参考方案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;

【讨论】：

谢谢 Vega，看来我的原始代码有点草率。稍微改变了你的代码来为按钮设置动画。我喜欢右箭头的“数学”解决方案！