Heim > Web-Frontend > js-Tutorial > Hauptteil

jQuery-Methode, um einen reibungslosen Bildlauf zum angegebenen Ankerpunkt_jquery zu erreichen

WBOY
Freigeben: 2016-05-16 16:08:19
Original
1377 Leute haben es durchsucht

Das Beispiel in diesem Artikel beschreibt, wie jQuery einen reibungslosen Bildlauf zum angegebenen Ankerpunkt implementiert. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Definieren Sie den angegebenen Ankerpunkt und rufen Sie den folgenden js-Code auf, um die Seite reibungslos an die angegebene Position zu scrollen. Dies ist sehr praktisch, z. B. zum Zurückkehren zum Seitenanfang, zum Ende der Seite usw.

// HTML:
// <h1 id="anchor">Lorem Ipsum</h1>
// <p><a href="#anchor" class="topLink">Back to Top</a></p>
$(document).ready(function() {
  $("a.topLink").click(function() {
    $("html, body").animate({
      scrollTop: $($(this).attr("href")).offset().top + "px"
    }, {
      duration: 500,
      easing: "swing"
    });
    return false;
  });
});
Nach dem Login kopieren

Ich hoffe, dass dieser Artikel für alle bei der jQuery-Programmierung hilfreich sein wird.

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage