smartFloat
$.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));
});
};
//使用:
//$("#nav_left_layout").smartFloat();
smartFloat的更多相关文章
- 固定浮动侧边栏(SmartFloat)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery插件学习之元素顶部悬浮
jquery插件的学习: HTML部分及应用 <!DOCTYPE html> <html> <head> <meta charset="utf-8& ...
- JS学习知我见(常用建站代码)
<!doctype html><html><head><meta charset="utf-8"><meta name=&qu ...
- AngularJS开发指南6:AngularJS表单详解
表单控件(input, select, textarea )是用来获取用户输入的.表单则是一组有联系的表单控件的集合. 用户能通过表单和表单控件提供验证的服务,知道自己的输入是否合法.这样能让用户交互 ...
- JS-JQ实现页面滚动时元素智能定位(顶部-其他部位)
先看效果: 阅读前提:充分理解div的三种定位方式:浮动,相对定位,绝对定位 方法一(顶部) 原理:直接使用css 进行控制:缺点:不兼容ie6-: 实现:positi ...
- Angularjs之表单实例(三)
正确引用js css文件后可运行 <!DOCTYPE html> <html ng-app='myApp'> <head> <title>Bootstr ...
- AngularJs学习笔记--Forms
原版地址:http://code.angularjs.org/1.0.2/docs/guide/forms 控件(input.select.textarea)是用户输入数据的一种方式.Form(表单) ...
- JS仿淘宝详情页菜单条智能定位效果
类似于淘宝详情页菜单条智能定位 对于每个人来说并不陌生!如下截图所示:红色框的那部分! 基本原理: 是用JS侦听滚动事件,当页面的滚动距离(页面滚动的高度)大于或者等于 "对象"( ...
- jQuery实现页面元素智能定位
实现过程 Js侦听滚动事件,当页面滚动的距离(页面滚动的高度)超出了对象(要滚动的层)距离页面顶部的高度,即要滚动的层到达了浏览器窗口上边缘时,立即将对象定位属性position值改成fixed(固定 ...
随机推荐
- SSE图像算法优化系列二十二:优化龚元浩博士的曲率滤波算法,达到约1000 MPixels/Sec的单次迭代速度
2015年龚博士的曲率滤波算法刚出来的时候,在图像处理界也曾引起不小的轰动,特别是其所说的算法的简洁性,以及算法的效果.执行效率等方面较其他算法均有一定的优势,我在该算法刚出来时也曾经有关注,不过 ...
- webpack 配置缓存
1.输出文件的文件名 加hash 2.提取引导模板 3.模块标识符 https://webpack.docschina.org/guides/caching/#src/components/Sideb ...
- java AOP Before, After, AfterReturning, AfterThrowing, or Around 注解
https://www.eclipse.org/aspectj/doc/next/adk15notebook/ataspectj-pcadvice.html Advice In this sectio ...
- Docker 的插件式设计
http://www.tuicool.com/articles/MnIRZvJ http://uzhima.com/2016/08/02/what-is-docker-volume-plugin/ 在 ...
- 【Android】解析AccessibilityService(辅助服务)的使用
辅助功能是Android系统提供的一种服务,派生自Service类.这个服务提供了增强的用户界面,目的是为了帮助残障人士.它一般提供了页面元素查找功能和元素点击功能. 通过辅助功能,开发者可以实现一些 ...
- Effective Java 第三版——82. 线程安全文档化
Tips 书中的源代码地址:https://github.com/jbloch/effective-java-3e-source-code 注意,书中的有些代码里方法是基于Java 9 API中的,所 ...
- Effective Java 第三版——65. 接口优于反射
Tips 书中的源代码地址:https://github.com/jbloch/effective-java-3e-source-code 注意,书中的有些代码里方法是基于Java 9 API中的,所 ...
- hive Spark SQL分析窗口函数
Spark1.4发布,支持了窗口分析函数(window functions).在离线平台中,90%以上的离线分析任务都是使用Hive实现,其中必然会使用很多窗口分析函数,如果SparkSQL支持窗口分 ...
- 【20180111】【物流FM专访】贝业新兄弟李济宏:我们是如何做到大件家居B2C物流第一的?
在2017年的双11中,贝业新兄弟承接了日日顺家装和卫浴行业的仓储和配送,上海仓和武汉仓双十一期间及时出库率为100%,KPI位列第一:此外,贝业新兄弟还是科勒18年以来中国区唯一的物流服务商以及宜家 ...
- Linux下源码安装xz的方法
xz是一个不太常见但又效率非常高的解压缩软件,安装方法如下 ,cd /usr/local/src ,wget https://tukaani.org/xz/xz-5.2.3.tar.gz //下载到/ ...