jQuery仿gmail实现fixed布局的方法

2019-11-20 12:24:13

字体：大中小

来源：转载

供稿：网友

本文实例讲述了jQuery仿gmail实现fixed布局的方法。分享给大家供大家参考。具体实现方法如下：

<!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><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>fixed bar demo</title><style type="text/css" media="screen">body{margin:0;height:2000px;}#top{background-color:#333;height:80px;}#nav{background-color:#999;height:30px;position:absolute;top:80px;width:100%;}</style><script src="jquery-1.6.2.min.js" type="text/javascript"></script><script type="text/javascript">$(function(){ $(window).scroll(function(){ var scrollTop = $(window).scrollTop(); if(scrollTop < 80) $("#nav").css('top', '80px'); else $("#nav").css('top', scrollTop +'px'); });});</script></head><body><div id="top"></div><div id="nav"></div></body></html>

希望本文所述对大家的jQuery程序设计有所帮助。

上一篇：jquery预加载图片的方法

下一篇：js实现键盘Enter键提交表单的方法