随滚动条动态滑动的图片_站点基地[zdbase.com]

详细内容

[关闭窗口]

随滚动条动态滑动的图片

发布日期：2010-09-02 点击：8327

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 随滚动条动态滑动的图片_站点基地 </TITLE>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>详细内容</title>
    <LINK href="../css/style.css" type=text/css rel=stylesheet>
    
    <script language="javascript">
    
    
//<![CDATA[

var tips; var theTop = 350/*这是默认高度,越大越往下*/; var old = theTop;

function initFloatTips() {

tips = document.getElementById('btnTop');
moveTips();

};

function moveTips() {

var tt=50;

if (window.innerHeight) {

pos = window.pageYOffset

}

else if (document.documentElement && document.documentElement.scrollTop) {

pos = document.documentElement.scrollTop

}

else if (document.body) {

pos = document.body.scrollTop;

}

pos=pos-tips.offsetTop+theTop;

pos=tips.offsetTop+pos/10;



if (pos < theTop) pos = theTop;

if (pos != old) {

tips.style.top = pos+"px";

tt=10;

//alert(tips.style.top);

}



old = pos;

setTimeout(moveTips,tt);

}

//!]]>

    </script>

<style type="text/css">
#btnTop{ width:23; height:21px; Z-INDEX: 99; right: 0px; POSITION: absolute; TOP: 350px}
#heightDiv{width:120px;height:50px; font-size:12px; color:#5c5c5c;}
#heightDiv a{color:#5c5c5c; text-decoration:none;}
#heightDiv a:hover{color:#ff5c5c; text-decoration:none;}
#heightDiv1{width:200px;height:5000px; font-size:12px; color:#5c5c5c;}
</style>
</head>
</HEAD>

<BODY onload="initFloatTips();">
<div id="btnTop"><div id="heightDiv">站点基地 网站素材<br/><br/> <a href='http://www.zdbase.com' target='_blank'>http://www.zdbase.com </a></div>
<A href="#"><IMG height=31 alt=顶部 src="http://www.zdbase.com/work/Editor/UploadFile/20109216544301.gif" width=23 border=0></A>
</div>
<div id="heightDiv1">站点基地 网站素材<br/><br/> <a href='http://www.zdbase.com' target='_blank'>http://www.zdbase.com </a></div>
</BODY>
</HTML>

提示：您可以先修改部分代码再运行，复制代码和保存代码功能在Firefox下无效。

用到的图片：