小开

最佳答案

为此，您可以为 animate 命令设置一个回调函数，该命令将在滚动动画完成后执行。

例如:

var body = $("html, body");
body.stop().animate({scrollTop:0}, 500, 'swing', function() {
alert("Finished animating");
});

在警报代码所在的位置，您可以执行更多的 javascript 来添加进一步的动画。

此外，“秋千”是有设置的放松。检查 http://api.jquery.com/animate/的更多信息。

小开

为此，可以使用回调方法

body.animate({
scrollTop:0
}, 500,
function(){} // callback method use this space how you like
);

小开

试试这个:

var body = $("body, html");
var top = body.scrollTop() // Get position of the body
if(top!=0)
{
body.animate({scrollTop :0}, 500,function(){
//DO SOMETHING AFTER SCROLL ANIMATION COMPLETED
alert('Hello');
});
}

小开

试试这个代码:

$('.Classname').click(function(){
 $("html, body").animate({ scrollTop: 0 }, 600);
 return false;
});

小开

用这个:

$('a[href^="#"]').on('click', function(event) {


var target = $( $(this).attr('href') );


if( target.length ) {
event.preventDefault();
$('html, body').animate({
scrollTop: target.offset().top
}, 500);
}


});

小开

使用 click 函数()的代码

    var body = $('html, body');


$('.toTop').click(function(e){
e.preventDefault();
body.animate({scrollTop:0}, 500, 'swing');


});

.toTop = 单击元素的类，可能是 img或 a

小开

jQuery("html,body").animate({scrollTop: jQuery("#your-elemm-id-where you want to scroll").offset().top-<some-number>}, 500, 'swing', function() {
alert("Finished animating");
});

小开

简单的解决办法:

通过 ID 或 NAME 滚动到任何元素:

SmoothScrollTo("#elementId", 1000);

密码:

function SmoothScrollTo(id_or_Name, timelength){
var timelength = timelength || 1000;
$('html, body').animate({
scrollTop: $(id_or_Name).offset().top-70
}, timelength, function(){
window.location.hash = id_or_Name;
});
}

小开

你得看看这个

$(function () {
$('a[href*="#"]:not([href="#"])').click(function () {
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
if (target.length) {
$('html, body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});

或者尝尝

$(function () {$('a').click(function () {
$('body,html').animate({
scrollTop: 0
}, 600);
return false;});});

小开

$("body").stop().animate({
scrollTop: 0
}, 500, 'swing', function () {
console.log(confirm('Like This'))
}
);

小开

你可以同时使用 CSS 类或 HTML id，为了保持对称性，我总是使用 CSS 类

<a class="btn btn-full js--scroll-to-plans" href="#">I’m hungry</a>
|
|
|
<section class="section-plans js--section-plans clearfix">

$(document).ready(function () {
$('.js--scroll-to-plans').click(function () {
$('body,html').animate({
scrollTop: $('.js--section-plans').offset().top
}, 1000);
return false;})
});

小开

大家好，我正面临着一个类似的问题，这对我来说很有效:

jQuery(document).on('click', 'element', function() {
let posTop = jQuery(target).offset().top;
console.log(posTop);
$('html, body').animate({scrollTop: posTop}, 1, function() {
posTop = jQuery(target).offset().top;


$('html, body').animate({scrollTop: posTop}, 'slow');
});
});

ScrollTop () ; + 动画

简单的解决办法: