让jQuery的scrollLeft工作

我遇到了一些问题，根据父级的scrollLeft值来左右移动动画。

.section是内部.container，并且如.container滚出屏幕，.section应该留基于的.container的scrollLeft值在屏幕上。

我已经设置了一个.show-me div来显示我自己应该设置新的left值.section的值。它显示正确的滚动偏移量，当我使用Chrome中的Inspect元素更改left值时，.section移动到正确的位置。

但他们不一起工作。关于发生了什么的任何线索？

我已经试过这两种方法：

$('.container').scroll(function() { 
    offset = $(".container").scrollLeft(); 
    $(".section").css("left",offset+"px !important"); 
    $(".show-me").text(offset+"px !important"); 
});

和

setInterval(function(){ 
    offset = $(".container").scrollLeft(); 
    $(".section").css("left",offset+"px !important"); 
    $(".show-me").text(offset+"px !important"); 
},1);

而且，无论似乎为我工作。帮帮我！

来源

2012-07-31 InterfaceGuy

你能否提供一个显示问题的[小提琴]（http://jsfiddle.net）。从它的外观来看，我相信你的两个例子都应该有效。 – 2012-07-31 19:19:59

我已经想通了。

当我将!important关闭CSS属性时，它可以工作。我不确定这是为什么会起作用，但确实如此。

尽管谢谢你的回答，但Christofer！

来源

2012-07-31 19:18:57 InterfaceGuy

很高兴你发现了这个问题！你在CSS文件中使用'！important'吗？这几乎从未被推荐。它打破了CSS的级联规则，并且经常会导致这些类型的神秘问题，这些问题往往是解决问题的难点。 – 2012-07-31 19:23:01

我非常谨慎地使用它。我从这个页面（全局样式，默认主题，当前主题）至少3个地方拉CSS，所以我需要在层叠之上。我只在需要覆盖文件中的规则的地方使用'！important'，稍后通过具有较早调用的文件中的规则调用。感谢您的提示，但！在我学习CSS级联之前，我的头痛不止。 – InterfaceGuy 2012-07-31 20:59:55

如果你愿意，可以不使用'！important'来实现。只要你以前的规则比你以后的规则具有更高的特异性，它们将优先于任何顺序。这里是[一篇好文章]（http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/）关于CSS的特殊性，让你开始。 – 2012-07-31 21:12:34

您的问题可能在第一行，您的选择器$('container')在开始时缺少.。我想应该是$('.container')。您尝试将滚动事件侦听器应用于不存在的元素。

来源

2012-07-31 18:43:25

这是抄录时的错误。代码中没有这种方式。 '.container'具有不同的名称，我将其重命名为'.container'，以方便和易用。我已经更新了我的代码。问题依然存在。 – InterfaceGuy 2012-07-31 19:11:42

让jQuery的scrollLeft工作

回答

相关问题