javascript 仿淘宝网悬停在页面固定位置的菜单窗口

时间：2012-07-09 编辑：简简单单来源：一聚教程网

提示：您可以先修改部分代码再运行

<!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>仿淘宝网悬停在页面固定位置的菜单窗口</title>
<meta http-equiv="content-type" content="text/html;charset=gb2312">

<style type="text/<a href="http://www.111com.net/cssdiv/css.html" target="_blank">css</a>">
*{padding:0;margin:0;}
#diya{background:#F45;position:absolute;left:100px;top:50px;z-index:5;}
#bod{position:relative;overflow:auto;background:#03C;top:25px;}
</style>
</head>
<body>

<div id="bod">
	<div id="diya"></div>
	<p style=""></p>
</div>
<script type="text/javascript">
function fixedTitle(con,con2){
	var bod = document.getElementById(con);
	var diya=document.getElementById(con2);
	var Ntop=diya.offsetTop;
	var tt=100;
	var bid=Ntop-tt;
	bod.onscroll=ss;
	function ss(){
		var jia=bod.scrollTop;
		if(jia<=Ntop){
			diya.style.top=Ntop+'px';
		}else{
			diya.style.top=jia+bid+'px';
		}
	}
}
fixedTitle("bod","diya")
</script>
</body>
</html></td>
	  </tr>
	</table>

提示：您可以先修改部分代码再运行

上一个： CSS文本溢出省略号兼容多种浏览器
下一个： css中overflow解决float浮动后高度自适应的问题

推荐专题

最新下载

热门教程

javascript 仿淘宝网悬停在页面固定位置的菜单窗口

相关文章

热门栏目

php教程

asp.net教程

手机开发

css教程

网页制作

办公数码

jsp教程