滚动条控制 div的显示与隐藏。

来源：互联网发布：中型企业网络架构编辑：程序博客网时间：2024/04/28 18:33

昨天在论坛上看见一个兄弟在提这个问题，就自己作了一个小例子，感觉很有意思，今天放了上来

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language='javascript'>

 function get_scrollTop_of_body(){
 var a = document.getElementById('div1');
 var scrollTop;
 if(typeof window.pageYOffset != 'undefined'){
 scrollTop = window.pageYOffset;
 }
 else
 if(typeof document.compatMode != 'undefined' &&
 document.compatMode != 'BackCompat'){
 scrollTop = document.documentElement.scrollTop;
 }
 else
 if(typeof document.body != 'undefined'){
 scrollTop = document.body.scrollTop;
 }
 if(scrollTop!=0)
 {
 a.style.display='block';
 }
 else
 {
 a.style.display='none';
 }
}
</script>
</HEAD>

<BODY onscroll='get_scrollTop_of_body()'>
<a name="tt">
aaaaa 
aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 <div id="div1" width="200" style='display:none;'><a href="#tt">回到顶部</a></div>
aaaaa 
aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
aaaaa 
aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
aaaaa 
aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
aaaaa 
aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
 aaaaa 
<script language="javascript">
 var divView = document.getElementById('div1');
 alert(document.body.clientWidth-divView.offsetWidth);
 divView.style.position="absolute";
 divView.style.right = "10px";
 divView.style.bottom = "20px";
</script>
</BODY>
</HTML>