jquery刷新页面 自动滑动到页面某一位置怎么写?
当打开这个页面的时候,页面滑动跳转到距离页面顶部100px的id="scroll"的div处,每次刷新页面的时候也会跳转到此处,这样的jQuery怎么写?谁能告诉我?谢谢...
当打开这个页面的时候,页面滑动跳转到距离页面顶部100px的id="scroll"的div处,
每次刷新页面的时候也会跳转到此处,这样的jQuery怎么写?谁能告诉我?谢谢!
页面body代码如下:
<body>
<div style="background-color:#ff6600; height:100px;">
</div>
<div id="scroll" style="height:1500px;">
滚动到这里
</div>
</body> 展开
每次刷新页面的时候也会跳转到此处,这样的jQuery怎么写?谁能告诉我?谢谢!
页面body代码如下:
<body>
<div style="background-color:#ff6600; height:100px;">
</div>
<div id="scroll" style="height:1500px;">
滚动到这里
</div>
</body> 展开
5个回答
展开全部
需要准备的材料分别有:电脑、html编辑器、浏览器。
1、首先,打开html编辑器,新建html文件,例如:index.html,并引入jquery。
2、在index.html中的<script>标签,输入jquery代码:
var container = $('body');
var scrollTo = $('#scroll');
container.scrollTop(
scrollTo.offset().top - container.offset().top + container.scrollTop()
);
container.animate({
scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop()
});
3、浏览器运行index.html页面,此时刷新页面会自动滑动到指定位置。
展开全部
有 jQuery 一句就足够了。第一个 scrollTop(0) 还原到顶端,防止刷新位置不变。
$("html, body").scrollTop(0).animate({scrollTop: $("#scroll").offset().top});
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
$(document).ready(function(){
autoScrollTo();
});
function autoScrollTo() {
var step = 20; //每次移动的像素
var time = 100; //移动间隔时间(毫秒)
var obj = $('#scroll'); //目标
var top = obj.offset().top;
var scroll = $(document).scrollTop();
if (top < scroll) {
if (scroll - top > step) {
var next = scroll + step;
} else {
var next = top;
}
$(document).scrollTop(next);
if (top < $(document).scrollTop())
setTimeout(autoScrollTo, time);
}
}
没测试,你试试看吧
追问
js没有起作用,不过还是谢谢了。
追答
楼上厉害,原来动画这个本身支持滚动条动画啊
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>test</title>
<style type='text/css'>
#demo{position:absolute;left:0;width:100%;height:800px;background:red;display:none;}
</style>
</head>
<body>
<div id="demo"></div>
<script type='text/javascript' src="jquery-1.8.3.js"></script>
<script type='text/javascript'>
$(function(){
$("#demo").css({"display":"block","top":$(window).height()})
$("#demo").animate({
top:"100px"
},2000,"swing")
})
</script>
</body>
</html>
直接复制加载JQ。。看下效果。。不知道是不是你要的效果。。
追问
不是我想要的,不过还是谢谢啦
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
写一个js 去控制它来滑动到你想要的位置
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询