<div id="div1" style="width:100px height:100px background:#ccc"></div>
</body>
<script>
var oDiv = document.getElementById('div1')
oDiv.style.position = 'fixed'
oDiv.style.top = '20px'
oDiv.style.left = '20px'
</script>
主要思想就是，在js中修改div的位置。所有的赋值，都可以计算后再传值，这样就不想CSS中只能写一个值了。
//html<div id="show">show</div>
//css
#show {width: 100pxheight: 100px background: #ccc display: none}
//js file
window.onload = function () {
//根据ID返回dom元素
var $ = function(id){return document.getElementById(id)}
//返回dom元素的当前某css值
var getCss = function(obj,name){
if(obj.currentStyle) {//for ie
return obj.currentStyle[name]
}else { // for ff
var style = document.defaultView.getComputedStyle(obj,null)
return style[name]
}
}
var show = function(obj,speed){
obj = $(obj)
if (!speed) {
obj.style.display = 'block'
return
}
var initH = 0 , initW = 0
//获取dom的宽与高
var oWidth = getCss(obj,'width').replace('px',''), oHeight = getCss(obj,'height').replace('px','')
//每次dom的递减数(等比例)
var wcut = 2*(+oWidth.replace('px','') / +oHeight.replace('px','')),hcut = 2
//处理动画函数
var process = function(){
obj.style.overflow = 'hidden'
obj.style.display = 'block'
initW = (initW+wcut) > oWidth ? oWidth : initW+wcut
initH = (initH+hcut) > oHeight ? oHeight : initH+hcut
//判断是否减完了
if(initW !== oWidth || initH !== oHeight) {
//obj.style.width = initW+'px'
obj.style.height = initH+'px'
setTimeout(function(){process()},speed)
}else {
//加完后，设置属性为显示以及原本dom的宽与高
//obj.style.width = oWidth+'px'
obj.style.height = oHeight+'px'
}
}
process()
}
show("show",50)
}
您好！具体代码如下，兼容各浏览器，其中scrollTop 为当前页面到顶部的距离，document.body.offsetHeight为整个页面的高度，document.documentElement.clientHeight为当前屏幕的高度，有不明白的可以问我，希望我的回答能帮到您！<br><!DOCTYPE html><br><html><br><head><br><meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" /><br><title></title><br><style><br>body{margin:0height:2000px}<br>div{height:500pxwidth:500pxbackground:#f00margin:0 auto}<br></style><br><script><br>window.onscroll=function(){<br>var scrollTop = document.documentElement.scrollTop||document.body.scrollTop<br>
if(scrollTop>=document.body.offsetHeight-document.documentElement.clientHeight)<br>
{<br>
document.
getElementById
("div1").style.display="none"
<br>
alert("去看看是不是DIV不见了")<br>
}<br>}<br></script><br></head><br><body><br><div id="div1"><br>
this is a div<br></div><br></body><br></html>
