Wie kann verhindert werden, dass die gesamte Seite gescrollt wird, wenn man auf ein Element innerhalb eines scrollbaren Div klickt?

So scrollen Sie innerhalb eines scrollbaren Divs

Wenn Sie auf ein Element innerhalb eines gescrollten Divs klicken, kann es zu einem Problem kommen, bei dem die gesamte Seite angezeigt wird scrollt statt nur der div. Um dieses Problem zu beheben, nutzen Sie die folgenden Schritte:

1. Berechnen Sie den vertikalen Versatz des gewünschten Elements relativ zu seinem übergeordneten Div:

<code class="javascript">var myElement = document.getElementById('element_within_div');
var topPos = myElement.offsetTop;</code>

2. Verwenden Sie scrollTop, um Scrollen Sie das Div zur angegebenen Position:

<code class="javascript">document.getElementById('scrolling_div').scrollTop = topPos;</code>

Alternativ für eine Prototyp-JS-Implementierung:

<code class="javascript">var posArray = $('element_within_div').positionedOffset();
$('scrolling_div').scrollTop = posArray[1];</code>

Dieser Ansatz stellt sicher, dass das Div scrollt, um das gewünschte Element anzuzeigen oben oder so weit unten wie möglich, wenn es standardmäßig nicht sichtbar ist.

Das obige ist der detaillierte Inhalt vonWie kann verhindert werden, dass die gesamte Seite gescrollt wird, wenn man auf ein Element innerhalb eines scrollbaren Div klickt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!