## Wie erreicht man mit jQuery in Firefox ein reibungsloses und zuverlässiges synchronisiertes Scrollen?

Optimierung des synchronisierten Scrollens und Firefox-Auflösung

Bei der Implementierung des synchronisierten Scrollens mit jQuery ist es wichtig, zwei potenzielle Probleme anzugehen:

1. Synchronisierung von Größenunterschieden

Um unterschiedliche DIV-Größen zu berücksichtigen, bestimmen Sie den Prozentsatz des gescrollten Inhalts:

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

Multiplizieren Sie die anderen DIVs (scrollHeight - offsetHeight) mit diesem Prozentsatz, um proportionales Scrollen zu erreichen.

2. Firefox-Scroll-Schleife

Firefox kann eine Endlosschleife von Scroll-Ereignissen auslösen. Um dies zu verhindern, heben Sie die Bindung des Listeners vorübergehend auf, legen Sie scrollTop fest und binden Sie es erneut:

<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>

Dieser Ansatz sorgt für ein gleichmäßigeres Scrollen in Firefox und verhindert das Problem der Endlosschleife. Eine Live-Demonstration ist verfügbar unter:

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

Das obige ist der detaillierte Inhalt von## Wie erreicht man mit jQuery in Firefox ein reibungsloses und zuverlässiges synchronisiertes Scrollen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!