Mit JavaScript an den Anfang der Seite blättern?

Question

Wie kann ich mit JavaScript an den Anfang der Seite blättern? Die Bildlaufleiste, die sofort an den Anfang der Seite springt, ist ebenfalls wünschenswert, da ich nicht auf einen reibungslosen Bildlauf aus bin.

Answer 1

Wenn Sie keinen flüssigen Bildlauf wünschen, können Sie schummeln und die Animation des flüssigen Bildlaufs stoppen, sobald Sie sie starten... etwa so:

   $(document).ready(function() {
      $("a[href='#top']").click(function() {
          $("html, body").animate({ scrollTop: 0 }, "1");              
          $('html, body').stop(true, true);

          //Anything else you want to do in the same action goes here

          return false;                              
      });
  });

Ich habe keine Ahnung, ob das empfohlen/erlaubt ist, aber es funktioniert :)

Wann würden Sie das verwenden? Ich bin mir nicht sicher, aber vielleicht, wenn Sie einen Klick verwenden möchten, um eine Sache mit Jquery zu animieren, aber eine andere ohne Animation zu tun? dh öffnen Sie ein Slide-in-Admin-Login-Panel am oberen Rand der Seite, und sofort an die Spitze springen, um es zu sehen.

Answer 2

Keine der obigen Antworten wird in SharePoint 2016 funktionieren.

Das muss so gemacht werden: https://sharepoint.stackexchange.com/questions/195870/

var w = document.getElementById("s4-workspace");
w.scrollTop = 0;

Answer 3

Sie können einfach ein Ziel aus Ihrem Link verwenden, z. B. #someid, wobei #someid die id des Divs ist.

Sie können aber auch eine beliebige Anzahl von Bildlauf-Plugins verwenden, die dies eleganter machen.

http://plugins.jquery.com/project/ScrollTo ist ein Beispiel.

Answer 4

Sie können versuchen, mit JS wie in diesem Fiddle http://jsfiddle.net/5bNmH/1/

Fügen Sie die Schaltfläche "Nach oben" in die Fußzeile Ihrer Seite ein:

<footer>
    <hr />
    <p>Just some basic footer text.</p>
    <!-- Go to top Button -->
    <a href="#" class="go-top">Go Top</a>
</footer>

Answer 5

document.getElementsByTagName('html')[0].scrollIntoView({ behavior: "smooth" });