代码如下:
!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
titlejquery.text-effects/title
meta http-equiv="Content-Type" content="text/html; charset=gb2312" /
style
*{
margin:0;
padding:0;
}
#test{
position:absolute;
top:10px;
right:10px;
width:130px;
height:60px;
background:#555;
color:#fff;
font-size:13px;
}
/style
script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type="text/javascript"/script
script language="javascript"
$(document).ready(function(){
var menuYloc = $("#test").offset().top;
$(window).scroll(function (){
var offsetTop = menuYloc + $(window).scrollTop() +"px";
$("#test").animate({top : offsetTop },{ duration:600 , queue:false });
});
});
/script
/head
body
h17行代码的跟随屏幕滚动层./h1
br/br/br/br/br/br/br/br/br/br/br/br/br/br/br/br/br/
div id="test"Dev By CssRain.cnbr/Test ie6+,firefox3.0/div
br/br/br/br/br/br/br/br/br/br/br/br/br/br/br/br/br/
br/br/br/br/br/br/br/br/br/br/br/br/br/br/br/br/br/
/body
/html
jQuery(1.3.2) 7行代码搞定跟随屏幕滚动的层
下面图老师小编要向大家介绍下jQuery(1.3.2) 7行代码搞定跟随屏幕滚动的层,看起来复杂实则是简单的,掌握好技巧就OK,喜欢就赶紧收藏起来吧!