Jquery中文网 www.jquerycn.cn
Jquery中文网 >  jQuery  >  jquery 教程  >  正文 jQuery页面滚动浮动层智能定位实例代码

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

发布时间:2013-06-23   编辑:www.jquerycn.cn
jQuery页面滚动浮动层智能定位实例代码,需要的朋友可以参考下。
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();

您可能感兴趣的文章:
jQuery页面滚动浮动层智能定位实例代码
js页面滚动时层智能浮动定位实现(jQuery/MooTools)
jQuery实现页面滚动时层智能浮动定位实例探讨
JQUERY 实现窗口滚动搜索框停靠效果(类似滚动停靠)
jQuery创建平滑的页面滚动(顶部或底部)
jquery滚动组件(vticker.js)实现页面动态数据的滚动效果
jquery实现图片左右间隔滚动特效(可自动播放)
jquery简单实现滚动条下拉DIV固定在头部不动
基于jquery的浮动层效果代码
jquery实现的一个导航滚动效果具体代码

[关闭]