所以我试图切换一个将有div滑入的类,但我也想同时跳转到div。但我似乎无法在YouTube或Google上找到任何内容。
$(document).ready(function() {
console.log("The page successfully loaded");
$('#click').on('click', function(){
$('#click').toggleClass('lol');
});
$('.anson').on('click', function() {
$('html, body').animate({scrollTop: 5000}, "slow");
})
$('#info').on('click', function(){
$("#about").toggle(500).animate({scrollTop: 5004}, "slow");
});
});
这是一个JSFiddle:https://jsfiddle.net/12cofeqh/
忽略不起作用的图像,只需单击底部的破碎图像,一直到最右边。 div应该弹出底部,但它不会滑到它上面,我想让它滑动/向下滚动到它。
嘿嗨兄弟这是你想要的,我在你的jquery做了一些改变
$(document).ready(function() {
console.log("The page successfully loaded");
$('#click').on('click', function(){
$('#click').toggleClass('lol');
});
$('#info').on('click', function() {
$('html').animate({scrollTop: 5000}, "slow");
});
$('#info').on('click', function(){
$("#about").toggle(500).animate({scrollTop: -200}, "slow");
});
});
这是fiddle
您必须在“显示动画”后添加滚动功能。将JS更改为:
$(document).ready(function() {
console.log("The page successfully loaded");
$('#click').on('click', function(){
$('#click').toggleClass('lol');
});
$('.anson').on('click', function() {
$('html, body').animate({scrollTop: 5000}, "slow");
})
$('#info').on('click', function(){
$("#about").toggle(500);
$("html").animate({scrollTop: 5004}, "slow");
});
});
你需要做的是添加一个回调函数来切换,一旦切换完成执行,它将滚动到该部分。请参阅下面的代码段
$('#about').toggle(500, function() {
$('html, body').animate({
scrollTop: $('#about').offset().top
}, 500);
});