Wie kann ich ein Div anzeigen, nachdem ich 800 Pixel nach unten gescrollt habe?

Div beim Scrollen nach 800 Pixel anzeigen

Szenario:
Sie benötigen, dass beim Scrollen ein verstecktes Div angezeigt wird mindestens 800 Pixel vom Seitenanfang entfernt. Um dies zu erreichen, müssen Änderungen an einem vorhandenen Beispiel vorgenommen werden.

Lösung:

Um Ihre Anfrage zu erfüllen, ändern Sie den jQuery-Code wie folgt:

$(document).scroll(function() {
  var y = $(this).scrollTop();
  if (y > 800) {
    $('.bottomMenu').fadeIn();
  } else {
    $('.bottomMenu').fadeOut();
  }
});

Erklärung:

• Der scroll()-Ereignis-Listener überwacht die Seite Scrollposition.
• Beim Scrollen nach unten über 800 Pixel hinaus (y > 800) wird das .bottomMenu-Div mit fadeIn() sichtbar.
• Beim Scrollen zurück nach oben auf eine Höhe unter 800 Pixel ( y < 800), wird das Div mit ausgeblendet fadeOut().

Beispiel:

<!-- HTML -->
<div class="bottomMenu">
  <!-- content -->
</div><pre class="brush:php;toolbar:false"><!-- CSS -->
.bottomMenu {
    display: none;
    width: 100%;
    height: 60px;
    border-top: 1px solid #000;
    position: fixed;
    bottom: 0;
    z-index: 100;
}

Das obige ist der detaillierte Inhalt vonWie kann ich ein Div anzeigen, nachdem ich 800 Pixel nach unten gescrollt habe?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!