pc端监听屏幕实现导航固定定位
要点:占位符

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端监听屏幕实现导航固定定位的更多相关文章
- 滚动条大于120px时,判断pc端的情况下,导航条固定定位
//滚动条大于120px时,判断pc端的情况下,导航条固定定位 $(window).scroll(function(){ var viewWidth=$(document).width() var ...
- JS 获取和监听屏幕方向变化(portrait / landscape)
移动设备的屏幕有两个方向: landscape(横屏)和portrait(竖屏),在某些情况下需要获取设备的屏幕方向和监听屏幕方向的变化,因此可以使用Javascript提供的 MediaQueryL ...
- PostgreSQL数据库服务端监听设置及客户端连接方法教程
众所周知,PostgreSQL 是一个自由的对象-关系数据库服务器(数据库管理系统),是一个可以免费使用的开放源代码数据库系统.本文详细介绍了PostgreSQL数据库服务端监听设置及客户端连接方法, ...
- Android 监听屏幕锁屏,用户解锁
在做一个程序的时候,需要时刻保持某一服务是启动的,因此想到了通过监听屏幕SCREEN_ON和SCREEN_OFF这两个action.奇怪的是,这两个action只能通过代码的形式注册,才能被监听到,使 ...
- Socket(TCP)客户端请求和服务端监听和链接基础(附例子)
一:基础知识回顾 一: Socket 类 实现 Berkeley 套接字接口. Socket(AddressFamily, SocketType,ProtocolType) 使用指定的地址族.套接字类 ...
- Android监听屏幕解锁和判断屏幕状态
开发后台服务的时候经常需要对屏幕状态进行判断,如果是想要监听屏幕解锁事件,可以在配置里面注册action为 android.intent.action.USER_PRESENT的广播,则可以监听解锁事 ...
- Android 监听屏幕锁屏&用户解锁
在做视频播放器的时候,遇到一个问题,在用户播放视频然后锁屏之后,视频播放器仍然在继续播放,遇到类似手机系统状态改变的问题的时候,首先想到了广播,下面做个总结: public class ScreenL ...
- 全局监听SCREEN_ON和SCREEN_OFF的替代方法--监听屏幕解锁事件
在做一个程序的时候,需要时刻保持某一服务是启动的,因此想到了通过监听屏幕SCREEN_ON和SCREEN_OFF这两个action.奇怪的是,这两个action只能通过代码的形式注册,才能被监听到,使 ...
- [Swift通天遁地]三、手势与图表-(1)监听屏幕上触摸事件的各种状态
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...
随机推荐
- git 命令使用速查手册( 个人版)
1. 克隆远程库 git clone repository_address 通过 git clone 获取的git库只是远程库中的当前工作分支,如果想获取其它分支信息,可参考下面. 2. 查看远程 ...
- 联想电脑Win8升级win10后Wlan关闭无法开启解决办法
官网下载电源驱动,下载无线网上驱动 开启电脑 按fn+f5 电源管理界面就出来了 把无线网卡打开 就ok了 这样就开启了无线! 如果还不行,可进行如下尝试,希望有所帮助: 1.开机进bios(一般是按 ...
- Triangulation by Ear Clipping(耳切法处理多边形三角划分)
使用EarClipping三角化多边形(翻译) ---Triangulation by Ear Clipping(http://www.geometrictools.com/Documentation ...
- HashMap之原理及死锁
一.HashMap原理 1.HashMap的本质就是数组和链表.table是一个entry数组,每一个数组元素保存一个Entry节点,而Entry节点内部又连接着同样key的下一个Entry节点,就构 ...
- c++ [wrong]simple "Garbage Collector"
In fact, Ptr alone can accomplish the task mentioned below. Implementation see Ptr.h, main2.cpp. In ...
- java中static变量的声明和初始化
目录(?)[+] 问题1静态变量如何初始化 问题2JDK如何处理static块 问题3如何看待静态变量的声明 对初始问题的解答 在网上看到了下面的一段代码: public class Test ...
- SQL数据库查询练习题(更正版)
一. 设有一数据库,包括四个表:学生表(Student).课程表(Course).成绩表(Score)以及教师信息表(Teacher).四个表的结构分别如表1-1的表(一)~表( ...
- Java基础05 实施接口(转载)
经过封装,产品隐藏了内部细节,只提供给用户接口(interface). 接口是非常有用的概念,可以辅助我们的抽象思考.在现实生活中,当我们想起某个用具的时候,往往想到的是该用具的功能性接口.比如杯子, ...
- Servlet 国际化
在我们开始之前,先来看看三个重要术语: 国际化(i18n):这意味着一个网站提供了不同版本的翻译成访问者的语言或国籍的内容. 本地化(l10n):这意味着向网站添加资源,以使其适应特定的地理或文化区域 ...
- MongoDB API和python操作
安装 下载mongodb的版本,两点注意 根据业界规则,偶数为稳定版,如1.6.X,奇数为开发版,如1.7.X 32bit的mongodb最大只能存放2G的数据,64bit就没有限制 到官网,选择合适 ...