## 如何在 Firefox 中使用 jQuery 實現平滑可靠的同步滾動？

同步滾動最佳化和Firefox 解析度

使用jQuery 實現同步滾動時，解決兩個潛在問題至關重要：

1.大小差異同步

為了考慮不同的DIV 大小，確定滾動內容的百分比：

percentage = element.scrollTop / (element.scrollHeight - element.offsetHeight)

將其他DIV 的（scrollHeight - offsetHeight）乘以該百分比即可實現比例滾動。

2. Firefox 滾動循環

Firefox 可能會觸發滾動事件的無限循環。為了防止這種情況，暫時解除監聽器的綁定，設定scrollTop，然後重新綁定它：

<code class="javascript">var $divs = $('#div1, #div2');
var sync = function(e){
    var $other = $divs.not(this).off('scroll'), other = $other.get(0);
    var percentage = this.scrollTop / (this.scrollHeight - this.offsetHeight);
    other.scrollTop = percentage * (other.scrollHeight - other.offsetHeight);
    setTimeout( function(){ $other.on('scroll', sync ); },10);
}
$divs.on( 'scroll', sync);</code>

這種方法可以平滑 Firefox 中的滾動並防止無限循環問題。現場示範可在：

[http://jsfiddle.net/b75KZ/5/](http://jsfiddle.net/b75KZ/5/)

以上是## 如何在 Firefox 中使用 jQuery 實現平滑可靠的同步滾動？的詳細內容。更多資訊請關注PHP中文網其他相關文章！