我有一个占屏幕 400% 的 div。当我单击 href 时,我希望 div 向左滑动。当 So far 时,div 向左移动然后跳回其原始位置。为什么要这样做?
这是我的jquery
<script type="text/javascript">
$(document).ready(function() {
$('#about').click(function() {
$('#main_div_wide_wrapper').animate({
'left' : "-=100%" //moves left
});
});
});
</script>
这是Html
<div id="main_div_wrapper">
<div id="main_div_wide_wrapper">
</div><!--end main_div_wide_wrapper-->
</div><!--end main_div_wrapper-->
<a class="bottom_link" href="" id="about">About</a>
这是CSS
#main_div_wrapper{
width:100%;
height:550px;
padding:0px;
margin:0px;
overflow:hidden;
}
#main_div_wide_wrapper{
position:relative;
width:400%;
height:550px;
background:#000;
padding:0px;
margin:0px;
}
最佳答案
$('#about').click(function(event) {
event.preventDefault();
$('#main_div_wide_wrapper').animate({
'left' : '-=100%' //moves left
});
});
你应该使用 http://api.jquery.com/event.preventdefault/ preventDefault() 方法...我猜是点击链接刷新页面,所以,它导致“跳转”...
关于Jquery函数在href点击时滑动div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22749990/