要点:占位符

js,监听屏幕滚动事件,当滚动条距离浏览器顶部的距离 大于 要固定定位开始以下元素的距离,则给要固定元素添加fixed样式。

初始化方法时,要给占位符添加样式

function sortNavInit() {
$(".consultBox").find(".sort-clone").css("height", $(".conditionList").outerHeight(false)); // .conditionList为要固定定位元素的类名
}
  $(window).scroll(function () {
var posTop = $(".consultBox").offset().top; //.consultBox元素为从 要 固定定位元素 开始到以下的层的类名
if ($(window).scrollTop() > posTop) {
$(".consultBox").addClass("fixed");
} else {
$(".consultBox").removeClass("fixed");
}
});

pc端监听屏幕实现导航固定定位的更多相关文章

  1. 滚动条大于120px时,判断pc端的情况下,导航条固定定位

      //滚动条大于120px时,判断pc端的情况下,导航条固定定位 $(window).scroll(function(){ var viewWidth=$(document).width() var ...

  2. JS 获取和监听屏幕方向变化(portrait / landscape)

    移动设备的屏幕有两个方向: landscape(横屏)和portrait(竖屏),在某些情况下需要获取设备的屏幕方向和监听屏幕方向的变化,因此可以使用Javascript提供的 MediaQueryL ...

  3. PostgreSQL数据库服务端监听设置及客户端连接方法教程

    众所周知,PostgreSQL 是一个自由的对象-关系数据库服务器(数据库管理系统),是一个可以免费使用的开放源代码数据库系统.本文详细介绍了PostgreSQL数据库服务端监听设置及客户端连接方法, ...

  4. Android 监听屏幕锁屏,用户解锁

    在做一个程序的时候,需要时刻保持某一服务是启动的,因此想到了通过监听屏幕SCREEN_ON和SCREEN_OFF这两个action.奇怪的是,这两个action只能通过代码的形式注册,才能被监听到,使 ...

  5. Socket(TCP)客户端请求和服务端监听和链接基础(附例子)

    一:基础知识回顾 一: Socket 类 实现 Berkeley 套接字接口. Socket(AddressFamily, SocketType,ProtocolType) 使用指定的地址族.套接字类 ...

  6. Android监听屏幕解锁和判断屏幕状态

    开发后台服务的时候经常需要对屏幕状态进行判断,如果是想要监听屏幕解锁事件,可以在配置里面注册action为 android.intent.action.USER_PRESENT的广播,则可以监听解锁事 ...

  7. Android 监听屏幕锁屏&用户解锁

    在做视频播放器的时候,遇到一个问题,在用户播放视频然后锁屏之后,视频播放器仍然在继续播放,遇到类似手机系统状态改变的问题的时候,首先想到了广播,下面做个总结: public class ScreenL ...

  8. 全局监听SCREEN_ON和SCREEN_OFF的替代方法--监听屏幕解锁事件

    在做一个程序的时候,需要时刻保持某一服务是启动的,因此想到了通过监听屏幕SCREEN_ON和SCREEN_OFF这两个action.奇怪的是,这两个action只能通过代码的形式注册,才能被监听到,使 ...

  9. [Swift通天遁地]三、手势与图表-(1)监听屏幕上触摸事件的各种状态

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

随机推荐

  1. Linux /proc/pid目录下文件的含义 (转)

    2013-01-16 16:10:36 分类: LINUX attr: 进程的属性 cmdline: 启动进程时执行的命令 cwd: 指向进程当前工作目录的软链 environ: 进程执行时使用的环境 ...

  2. (五)EasyUI使用——datagrid数据表格

    DataGrid以表格形式展示数据,并提供了丰富的选择.排序.分组和编辑数据的功能支持.DataGrid的设计用于缩短开发时间,并且使开发人员不需要具备特定的知识.它是轻量级的且功能丰富.单元格合并. ...

  3. python 列表,元组,字符串方法和属性

    python序列包含列表[].元组().字符串三种 -------列表-------------- 一.列表基本内容 1.建立:a=[1,2,3,5],通过[ , ,], >>>b= ...

  4. css之定位学习

    如需转载烦请注明出处: 英文原文:http://www.vanseodesign.com/css/css-positioning/ 中文译文:http://www.w3cplus.com/blog/p ...

  5. Scala 机器学习库

    自然语言处理 ScalaNLP-机器学习和数值计算库的套装 Breeze -Scala用的数值处理库 Chalk-自然语言处理库. FACTORIE-可部署的概率建模工具包.用Scala实现的软件库. ...

  6. Failed to add reference to 'System.Net.Http'. Please make sure that it is in the Global Assembly Cache.

    关闭VS再来就好了

  7. nginx.conf 详细

    ##定义nginx运行的用户各用户组user nginx nginx; ##nginx进程数,建议设置与cpu核心数一致worker_processes 1; ##全局错误日志定义类型[ debug ...

  8. Windows Mobile 6开发环境搭建

    Windows Mobile 6开发环境搭建 本文主要介绍在已有的Visual Studio 2005和Microsoft SQL Server2008环境基础上,如何搭建Windows Mobile ...

  9. HDU - 5301 Buildings

    Buildings Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Others) Total S ...

  10. hdu2588 GCD 给定n,m。求x属于[1,n]。有多少个x满足gcd(x,n)>=m; 容斥或者欧拉函数

    GCD Time Limit: / MS (Java/Others) Memory Limit: / K (Java/Others) Total Submission(s): Accepted Sub ...