jQuery页面滚动浮动层智能定位实例代码

200 阅读 0 评论 132 点赞

我是靠谱客的博主害羞老鼠，这篇文章主要介绍jQuery页面滚动浮动层智能定位实例代码，现在分享给大家，希望可以做个参考。

HTML代码：

复制代码代码如下:

 
<div class="float" id="float"> 
我是个腼腆羞涩的浮动层... 
</div> 

JS代码：

复制代码代码如下:

 
$.fn.smartFloat = function() { 
var position = function(element) { 
var top = element.position().top, pos = element.css("position"); 
$(window).scroll(function() { 
var scrolls = $(this).scrollTop(); 
if (scrolls > top) { 
if (window.XMLHttpRequest) { 
element.css({ 
position: "fixed", 
top: 0 
}); 
} else { 
element.css({ 
top: scrolls 
}); 
} 
}else { 
element.css({ 
position: "absolute", 
top: top 
}); 
} 
}); 
}; 
return $(this).each(function() { 
position($(this)); 
}); 
}; 
//绑定 
$("#float").smartFloat(); 