Tip: you can modify some code before running
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>Practical fixed floating effect on top of webpage</title><meta http-equiv="content-type" content="text/html;charset=gb2312"><!--把下面代码加到<head>与</head>之间--><style type="text/css">* {Margin: 0; padding: 0;} ul, li {list-style: none;} # content {width: 600px; margin: 0 auto; border: 1px solid # f00;} ul li. zzjs {width: 400px; text-align: center; margin: 20px 100px; background: # 00f; color: # fff; font-size: 14px; font-weight: bold; height: 100px; line-height: 100px; }# fudong {position: absolute; top: 0; left: 50%; width: 900px; margin-left:-pixel px; height: 30px; line-height: 30px; text-align: center; background: #000; color: # fff; font-size: 14px; font-weight: bold; z-index: 2 ;}</style></head><body><div ></div><!--把下面代码加到<body>与</body>之间--><div id="fudong">Web page creation tutorial http://www.111cn.net</div><script language="javascript">Var speed = 100; var scrollTop = null; var hold = 0; var fudong; var pos = null; var timer = null; var moveHeight = null; fudong = document. getElementById ("fudong"); window. onscroll = scroll_ad; function scroll_ad () {scrollTop = document.doc umentElement. scrollTop + document. body. scrollTop; pos = scrollTop-fudong. offsetTop; pos = pos/10 moveHeight = pos> 0? Math. ceil (pos): Math. floor (pos); if (moveHeight! = 0) {fudong. style. top = fudong. offsetTop + moveHeight + "px"; setTimeout (scroll_ad, speed);} // alert (scrollTop );}</script></body></html></td> </tr></table>
Tip: you can modify some code before running
