讓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工作

回答

相關問題