源碼
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
</head>
<script>
function goScroll(a){
var space=document.getElementById(a).offsetTop;
document.getElementById(a).style.top=space+'px';
var goTo =0;
window.setInterval(function(){
var height=document.documentElement.scrollTop+document.body.scrollTop+space;
var top=parseInt(document.getElementById(a).style.top);
if (height!=top) {
goTo=height-parseInt((height-top)*0.9);
document.getElementById(a).style.top=goTo+'px';
}
},50);
}
function init(){
goScroll('conl');
}
</script>
<style>
#conl{
background-color: gray;
left: 0px;
top: 100px;
width: 100px;
height: 100px;
position: absolute;
z-index=1;
}
body{
height: 8000px;
}
</style>
<body style="text-align: center" onload="init()" >
<div id="conl">這是一個廣告</div>
</body>
</html>
幾個問題
1.
offsetTop :
當(dāng)前對象到其上級層頂部的距離.
不能對其進(jìn)行賦值.設(shè)置對象到頁面頂部的距離請用style.top屬性.
scrollTop:對象的最頂部到對象在當(dāng)前窗口顯示的范圍內(nèi)的頂邊的距離．即是在出現(xiàn)了縱向滾動條的情況下，滾動條拉動的距離．
document .documentElement.scrollTop; 要獲取當(dāng)前頁面的滾動條縱坐標(biāo)位置，用：
網(wǎng)頁被卷去的高： document .body.scrollTop;
想了解更多點這個
document.body.scrollTop與document.documentElement.scrollTop兼容,這兩天在寫一個JS的網(wǎng)頁右鍵菜單，在實現(xiàn)菜單定位的時候發(fā)現(xiàn)了這個問題：chrome居然不認(rèn)識document.documentElement.scrollTop！
看前輩們的文章，紛紛表示如果有文檔聲明（即網(wǎng)頁第一句的docType）的情況下，標(biāo)準(zhǔn)瀏覽器是只認(rèn)識documentElement.scrollTop的，但chrome雖然我感覺比firefox還標(biāo)準(zhǔn)，但卻不認(rèn)識這個，在有文檔聲明時，chrome也只認(rèn)識document.body.scrollTop.由于在不同情況下，document.body.scrollTop與document.documentElement.scrollTop都有可能取不到值，那到底網(wǎng)頁的scrollTop值怎么得到呢？難道又要用JavaScript進(jìn)行判斷？其實不必。因為document.body.scrollTop與document.documentElement.scrollTop兩者有個特點，就是同時只會有一個值生效。比如document.body.scrollTop能取到值的時候，document.documentElement.scrollTop就會始終為0；反之亦然。所以，如果要得到網(wǎng)頁的真正的scrollTop值，可以這樣：
var sTop=document.body.scrollTop+document.documentElement.scrollTop;
這兩個值總會有一個恒為0，所以不用擔(dān)心會對真正的scrollTop造成影響。一點小技巧，但很實用。
2.parseInt()
parseInt(string, radix)
radix，表示轉(zhuǎn)換的基數(shù)，也就是我們常說的2進(jìn)制、8進(jìn)制、10進(jìn)制、16進(jìn)制等。范圍從2~36，但我們在JS中一般調(diào)用該方法時，基本都是以10為基數(shù)進(jìn)行轉(zhuǎn)換的。
如果該參數(shù)小于 2 或者大于 36，則 parseInt() 將返回 NaN。
3.setInterval
格式如下：
setInterval(function(){trace("每隔1秒鐘我就會顯示一次")},1000);
//這里的function(){}是沒有函數(shù)名的函數(shù)。成為匿名函數(shù)，后面的1000是時間間隔，單位是毫秒。
4.alert(typeof(top));
調(diào)試用比較方便
5.比較運算符
== 等于===全等!=不等于 >大于 <小于>=大于或等于 <=小于或等于
6.擴(kuò)展
function back(){
document.documentElement.scrollTop = document.body.scrollTop =0;
}
