$（window）.width（）和$（'body'）。scrollLeft（）在IE和Firefox中不起作用

Question

樣本： http ： //kat.isltest.net/col/

該示例站點正在使用chrome。 功能是即使包含1600px的div，主體也會居中。 然后，默認情況下，滾動條位於每個窗口大小的中心。

現在，問題是這在IE和Firefox中不起作用。

這是代碼：

if ($(window).width() <= 1600) {
    $('body').scrollLeft(0);
}
if ($(window).width() <= 1400) {
    $('body').scrollLeft(110);
}
if ($(window).width() <= 1360) {
    $('body').scrollLeft(130);
}
if ($(window).width() <= 1280) {
    $('body').scrollLeft(170);
}
if ($(window).width() <= 1152) {
    $('body').scrollLeft(235);
}
if ($(window).width() <= 1024) {
    $('body').scrollLeft(300);
}
if ($(window).width() <= 800){
    $('body').scrollLeft(400);
}

你們知道為什么嗎？ 非常感謝！ :)

Answer 1

您需要用一個偵聽器包裝代碼，該偵聽器在調整窗口大小時執行，否則滾動條僅調整一次：

$(window).on('resize', function() {
  /* your code */
});

我猜想，當瀏覽器窗口的寬度小於1600px時，chrome將其垂直滾動條調整到中心的原因是默認行為，與您的代碼無關。

編輯

此外，如果要使視口滾動，則需要使用$(document).scrollLeft()而不是$('body').scrollLeft() 。

Answer 2

如果要滾動單擊任何按鈕，則可以使用jquery執行以下操作。

$('#next').click(function(event) {
event.preventDefault();
$('.surr-cor').animate({
scrollLeft: "+=1350px"
}, "slow");
});

為Firefox提及事件，因為它可以處理事件。 您可以將.surr-cor替換為div元素或body