急！求指教：页面滚动的某一个div的位置时，div增加css3上移或下移效果。
类似：http://www.mi.com/note3/是否要用scrolltopoffset获取元素的位置？再用if来写？...
类似：http://www.mi.com/note3/
是否要用scroll top offset获取元素的位置？再用if来写？ 展开
是否要用scroll top offset获取元素的位置？再用if来写？ 展开
2个回答
展开全部
scroll top offset获取的是scroll了多少像素，你需要先规定好（或者动态算出）关键div的位置，然后通过onscroll事件，监控scroll top offset，看看是否到了某个div附近，然后执行响应动作。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
transform: translateY(-0.152672px); opacity: 1;
追问
当div滚动到屏幕可视区域时，css3效果自动展示，页面往下拉动时，效果展示，页面往上拉动时，div样式复原。我的问题是，这种效果怎么用js来控制？
追答
原理大概就是不断修改translateY的值，不超过data-move规定的距离
触发事件不太清楚因为他的代码经过混淆了，文件是summary.js。我写了个简单的onscroll的。
<title></title>
<style type="text/css">
*{
margin: 0;
padding:0;
}
#active {
width:200px;height:400px;background-color:grey; color:white;
}
</style>
<script src="在这个地方引入jquery文件"></script>
<script type="text/javascript">
window.onscroll = function() {
var off = $(window).scrollTop();
$("#active").text($(window).scrollTop());
//300以内跟着跑，300以外停止。
if(off < 300) {
var d = $("#active").attr("style", "transform:translateY("+off+"px)");
}
}
</script>
</head>
<body>
<div style="height:1500px;">
<div id = "active" style="transform:translateY(10);"></div>
</div>
</body
他们这个网页实现的复杂一点。本来想贴段代码片段，但是字数限制，你可以自己保存个网页，然后找个在线解压工具解压一下，文件末尾的两个函数var s = function(t, a) {
和$(".J_movePic").each(function(t) {
还能看出点东西来。确实是基于偏移的。
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
