jQuery页面滚动浮动层智能定位实例代码
更新时间：2011年08月23日 23:23:26 作者：
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();
复制代码 代码如下:
<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();
相关文章
改进版,支持多个输入框!前面因为多个输入框信息不好保存所以只能支持一个,现在用输入框的alt属性来保存修改前的内容,所以能支持多个输入框了.初步测试没发现问题,欢迎大家一起测试改进!!!2010-05-05
jQuery ul标签下拉菜单演示代码，需要使用基于jquery的下拉菜单效果的朋友可以参考下。2010-12-12
这篇文章主要介绍了jQuery获取某天的农历日期并判断是否除夕或新年的方法,涉及jQuery针对日期与时间的相关操作技巧,需要的朋友可以参考下2016-03-03
JQuery使用index方法获取Jquery对象数组下标的方法
这篇文章主要介绍了JQuery使用index方法获取Jquery对象数组下标的方法,涉及jQuery中index方法的使用技巧,需要的朋友可以参考下2015-05-05
本篇文章主要是对使用jQuery与JSONP轻松解决跨域访问的问题进行了详细的介绍，需要的朋友可以过来参考下，希望对大家有所帮助2014-02-02
fadeOut() 方法逐渐改变被选元素的不透明度，从可见到隐藏（褪色效果）。这篇文章给大家介绍jquery fadeout异步实例代码，感兴趣的朋友一起看下吧2016-08-08
jQuery实现网页上键盘左右方向键翻页代码,我们在很多小说网站经常看到这样的效果,这样可以给网站提高用户体验,方便访客翻页使用,从而大大提高了网站PV2015-04-04
这篇文章主要为大家详细介绍了jquery事件绑定解绑机制源码，感兴趣的小伙伴们可以参考一下2016-09-09
很多数据统计效果中，柱状条方式的算是比较常见的一种，形象直观，下面就是一段能够实现此功能的代码实例，并且具有一定的动态效果，感兴趣的朋友可以参考一下2016-02-02
这篇文章主要为大家详细介绍了jQuery实现回到顶部效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2020-10-10
最新评论