如何根据 CSS 中的 margin-left 值使用 jQuery 隐藏元素？答案

【问题标题】：How can I hide an element using jQuery based on the value of it's margin-left in the CSS?如何根据 CSS 中的 margin-left 值使用 jQuery 隐藏元素？
【发布时间】：2012-03-24 00:38:14
【问题描述】：

我正在开发一个轮播式滑块，并希望在ul 的左边距等于-3480px 时隐藏其中一个控件。这是我的代码：

$(function(){
    if($("ul#listName").css("margin-left") == "-3480px"){
      $(".nextButton").hide();
    }    
});

但它什么也没做，我不知道下一步该做什么。有没有人指点或建议？

【问题讨论】：

使用jquery UI，不要重新发明轮子！ ;)
另外，设置一个 JS fiddle，这样我们可以更清楚地看到你在尝试什么
jQuery 中的 .css() 方法返回与您的查询匹配的第一个元素。 “ul#listName”是否有多个匹配项？
@MildFuzz 我很想使用 jQuery UI，但这是一个非常奇怪的轮播实现，不适合 web。
我已经尝试过你的代码并且它可以工作（显然适应了不同的选择器）。您是否检查过该列表是否有该边距？也许它没有得到那个确切的数字，尝试用 Firebug（或类似的）检查。

标签： javascript jquery css margin

【解决方案1】：

根据您制作动画的样式属性，您应该检查它。还要确保在比较之前将值转换为 int，因为css() 方法也会给出单位（px/em..）及其值。

    if(parseInt($("ul#listName").css("margin-left"), 10) == -3480){
        $(".nextButton").hide();
    }

如果您在任何动画回调上执行此代码，那么我建议您检查<= 而不是==，因为在动画期间该值可能不是那么完美。试试这个。

    if(parseInt($("ul#listName").css("margin-left"), 10) <= -3480){
        $(".nextButton").hide();
    }

【讨论】：

【解决方案2】：

var mm = $("ul#listName").css("margin-left");
if(mm == -3480+"px"){
  $(".nextButton").hide();
}

【讨论】：

【解决方案3】：

var leftMargin = parseInt($('ul#listName').css('margin-left'), 10);
if (leftMargin == -3480){
  $('.nextButton').hide();
}

我使用parseInt 来显示替代方案，并避免在px 后缀时可能遇到的任何挂断。

【讨论】：

【解决方案4】：

var p = $(".your_class");
var position = p.position();
  if(p.position().left == '-3480px'){
$(".nextButton").hide();
}

【讨论】：

position 返回一个数字对象。
是的，如果你使用 position().left 返回左位置 :) 测试并在两个滑块中使用它

【解决方案5】：

我没有你的完整脚本可玩，但我建议在$("ul#listName").css("margin-left") 上执行console.log()，看看它是否真的能输出你认为的结果。如果你没有达到那个确切的值，我也会使用

我只是在这里假设，但希望这会有所帮助。

【讨论】：