Jquery在Firefox和Chrome中滾動到底部

function run_battle() { 

if(battlenow.length>0) { 
var div = document.getElementById('show_battle'); 
    $("#show_battle").animate({ scrollTop: $("#show_battle").prop("scrollHeight") -  $('#show_battle').height() }, 100); 
var attempt = battlenow.shift(); 
div.innerHTML += attempt; 
    $("#show_battle").animate({ scrollTop: $("#show_battle").prop("scrollHeight") - $('#show_battle').height() }, 100); 
setTimeout("run_battle()",800); 
    } 
}

這是我到目前爲止所做的。它在Firefox中效果很好。但在Chrome中，它根本不起作用。我正在使用Jquery 1.7.1，所以這就是爲什麼我使用.prop而不是.attr。Jquery在Firefox和Chrome中滾動到底部

battlenow數組就是這樣的。

battlenow.push('Alan hit Joe<br><br>'); 
battlenow.push('Joe fainted<br><br>Battle Over');

如果有幫助的話。

謝謝。

來源

2012-04-29 AlanPHP

下面是我使用的代碼，可以在所有瀏覽器中滾動到特定的元素。此代碼滾動最小量以獲取屏幕上的元素，您可能需要不同的東西。注意檢查WebKit瀏覽器：

(function($) { 

    $.fn.scrollMinimal = function() { 

    var cTop = this.offset().top; 
    var cHeight = this.outerHeight(true); 
    var windowTop = $(window).scrollTop(); 
    var visibleHeight = $(window).height(); 

    if (cTop < windowTop) { 
     $(jQuery.browser.webkit ? "body": "html") 
     .animate({'scrollTop': cTop}, 'slow', 'swing'); 
    } else if (cTop + cHeight > windowTop + visibleHeight) { 
     $(jQuery.browser.webkit ? "body": "html") 
     .animate({'scrollTop': cTop - visibleHeight + cHeight}, 'slow', 'swing'); 
    } 
    }; 

}(jQuery));

調用，如：

$('#actions').scrollMinimal();

來源

2012-04-29 20:51:32 Bill

我已經試過了已經。我的「show_battle」div在另一個div內。當我使用該代碼時，它滾動父div而不是我想要的。 – AlanPHP

我用這個聊天窗口來滾動到最後一個div裏面的div，這樣肯定有效。我想我不明白你所看到的。如果你想到達div的底部，你可以在目標區域後立即創建一個佔位符div，然後滾動到佔位符div。 – Bill

仍然無法在Chrome中使用。 – AlanPHP

Jquery在Firefox和Chrome中滾動到底部

回答

相關問題