要点:占位符

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. 【private HibernateTemplate template;】 的作用

    [private HibernateTemplate template;] 的作用 这个是在spring中定义了一个bean,它是org.springframework.orm.hibernate3. ...

  2. stm32 IDR寄存器软件仿真的BUG

    /* * 函数名:Key_GPIO_Config * 描述 :配置按键用到的I/O口 * 输入 :无 * 输出 :无 */ void Key_GPIO_Config(void) { GPIO_Init ...

  3. vue 销毁组件

    销毁组件 // get~ 销毁组件 destroyElement() { this.$destroy(true); this.$el.parentNode.removeChild(this.$el); ...

  4. Spring Boot(五):Spring Boot的启动器Starter大全及自定义Starter

    现有启动器Starter目录 Spring Boot应用启动器基本的一共有44种,具体如下: 1)spring-boot-starter 这是Spring Boot的核心启动器,包含了自动配置.日志和 ...

  5. [ci]项目规划-后续

      几个方面来写   1,搭建gitlab 配邮箱 域名等使之好用 2,搭建jenkins –yum,安装常见插件 3,搭建sonar,汉化 4,安装sonar-scanner   0,实现sonar ...

  6. C++语言基础(8)-引用

    (重要)使用引用的一些注意点: 1.引用不能绑定临时数据,也不能绑定任何无法获取内存地址的常量,表达式,或值,常引用除外. 第一种写法:(错误) int func_int(){ ; return n; ...

  7. flink-connector-kafka consumer的topic分区分配源码

    转载请注明原创地址 http://www.cnblogs.com/dongxiao-yang/p/7200599.html flink官方提供了连接kafka的connector实现,由于调试的时候发 ...

  8. 485. Max Consecutive Ones【easy】

    485. Max Consecutive Ones[easy] Given a binary array, find the maximum number of consecutive 1s in t ...

  9. Pycharm上python unittest不执行"if __name__ == '__main__' "问题or选择非unittest run

    转:http://www.cnblogs.com/csjd/p/6366535.html python unittest不执行"if __name__ == '__main__' " ...

  10. linux. -bash: fork: retry: Resource temporarily unavailable错误

    切换用户或登陆服务器后执行ls命令报错: -bash: fork: retry: Resource temporarily unavailable 上面这段错误提示的本质是Linux操作系统无法创建更 ...