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.
Antworten
Zu viele Anzeigen?
Mardzis
Punkte
732
function scrolltop() {
var offset = 220;
var duration = 500;
jQuery(window).scroll(function() {
if (jQuery(this).scrollTop() > offset) {
jQuery('#back-to-top').fadeIn(duration);
} else {
jQuery('#back-to-top').fadeOut(duration);
}
});
jQuery('#back-to-top').click(function(event) {
event.preventDefault();
jQuery('html, body').animate({scrollTop: 0}, duration);
return false;
});
}
Anh Tran
Punkte
59
Aktiv alle Browser. Viel Glück
var process;
var delay = 50; //milisecond scroll top
var scrollPixel = 20; //pixel U want to change after milisecond
//Fix Undefine pageofset when using IE 8 below;
function getPapeYOfSet() {
var yOfSet = (typeof (window.pageYOffset) === "number") ? window.pageYOffset : document.documentElement.scrollTop;
return yOfSet;
}
function backToTop() {
process = setInterval(function () {
var yOfSet = getPapeYOfSet();
if (yOfSet === 0) {
clearInterval(process);
} else {
window.scrollBy(0, -scrollPixel);
}
}, delay);
}
MitaCloud
Punkte
141
rajmobiapp
Punkte
819
Einfach ausprobieren, keine weiteren Plugins/Frameworks erforderlich
document.getElementById("jarscroolbtn").addEventListener("click", jarscrollfunction);
function jarscrollfunction() {
var body = document.body; // For Safari
var html = document.documentElement; // Chrome, Firefox, IE and Opera
body.scrollTop = 0;
html.scrollTop = 0;
}
<button id="jarscroolbtn">Scroll contents</button>
html, body {
scroll-behavior: smooth;
}
Alan Kael Ball
Punkte
680
Wenn Sie zu einem beliebigen Element mit einer ID blättern möchten, versuchen Sie dies:
$('a[href^="#"]').bind('click.smoothscroll',function (e) {
e.preventDefault();
var target = this.hash;
$target = $(target);
$('html, body').stop().animate({
'scrollTop': $target.offset().top
}, 700, 'swing', function () {
window.location.hash = target;
});
});``