我是jquery的新手,所以请耐心等待我!
当您点击其上方的图片时,我正在使用下面的代码滚动打开包含文本的div。除了图像靠近屏幕底部时,此功能也很好。然后打开包含文本的div,但它会在折叠下面打开 - 即你要向下滚动屏幕才能看到它。
是否有一种简单的方法可以添加到下面的代码中,当div向下滚动时会向上移动页面?这样用户就不必向下滚动页面来查看文本了吗?
由于
$(document).ready(function() {
//Set default open/close settings
$('.acc_container').hide(); //Hide/close all containers
$('.acc_trigger:first').next().hide(); //Add "active" class to first trigger, then show/open the immediate next container
//On Click
$('.acc_trigger').click(function(){
if( $(this).next().is(':hidden') ) { //If immediate next container is closed...
$('.acc_trigger').next().slideUp(); //Remove all "active" state and slide up the immediate next container
$(this).toggleClass('active').next().slideDown(); //Add "active" state to clicked trigger and slide down the immediate next container
}
return false; //Prevent the browser jump to the link anchor
});
});
答案 0 :(得分:0)
您可以使用:
演示:http://jsfiddle.net/SO_AMK/uecpG/
jQuery:
$(document).ready(function() {
$('.acc_container').hide();
$('.acc_trigger:first').next().hide();
$('.acc_trigger').click(function() {
if ($(this).next().is(':hidden')) {
$('.acc_trigger').next().slideUp();
$(this).toggleClass('active').next().slideDown(400, function() {
$(document).scrollTop($(this).prev().position().top);
});
}
return false;
});
});
请注意,没有动画,实现一个会需要更多代码,因为元素的高度会不断变化,如果你有一个预定的高度而不是数学很简单。