问题描述
滚动一定的距离则使某个元素显示,反之则隐藏? 问题补充:<!DOCTYPE html><br /><html lang="en"><br /><head><br /><title>templates</title><br /><meta charset="utf-8" /><br /><script type="text/javascript" src="../js/jquery-1.6.2.min.js"></script><br /><script type="text/javascript"><br /> function move2(){ <br />var content = document.getElementById("backMarck"); <br />//alert(content.offsetTop+"--"+document.documentElement.scrollTop); <br />var top =document.documentElement.scrollTop; <br />content.style.top=top+"px"; <br />} <br /><br />function move1(){ <br /> //鼠标滚动 <br />document.body.onmousewheel = function(){ <br />move2(); <br />} <br />//拖动滚动条 <br />window.onscroll = function(){ <br />move2(); <br />} <br /><br />}<br /><br /></script><br /><style type="text/css"><br /> body{<br /> width: 100%;<br /> height: 2000px;<br /> <br /> }<br />#backMarck{<br />background: red;<br />width: 200px;<br />height: 100px;<br />position: fixed;<br />bottom: 80px;<br />right: 100px;<br />}<br /></style><br /></head><br /><br /><body><br /><div id="backMarck">1111</div><br /></body><br /></html><br /><br /><br />没有显示。。
解决方案
$(window).scroll(function() { var h1 = $.browser.webkit ? $("body").scrollTop() : $(document).scrollTop(); if (h1 > 20) { //页面下拉高度达到20像素 就显示 $("#backMarck").show(); } else { $("#backMarck").hide(); }});
解决方案二:
以前写的jquery代码,应该算是兼容IE chrome FF的吧 #backMarck是要显示的东西 $(window).scroll(function() {var h1 = $.browser.webkit ? $("body").scrollTop() : $(document).scrollTop();if (h1 > 20) {$("#backMarck").show();} else {$("#backMarck").hide();} });
解决方案三:
function move2(){ var content = document.getElementById("div"); //alert(content.offsetTop+"--"+document.documentElement.scrollTop); var top =document.documentElement.scrollTop; content.style.top=top+"px"; } function move1(){ //鼠标滚动 document.body.onmousewheel = function(){ move2(); } //拖动滚动条 window.onscroll = function(){ move2(); } }