$(function(){
  //获取要定位元素距离浏览器顶部的距离
  var navH = $(".win").offset().top;
  //滚动条事件
  $(window).scroll(function(){
    //获取滚动条的滑动距离
    var scroH = $(this).scrollTop();
    //滚动条的滑动距离大于等于定位元素距离浏览器顶部的距离,就固定,反之就不固定
    if(scroH>=navH){
      $(".win").css({"position":"fixed","top":0});
    }else if(scroH<navH){
      $(".win").css({"position":"absolute","top":200,"right":70});
    }
  });
});

Jquery DIV滚动至浏览器顶部后固定不动代码的更多相关文章

  1. Jquery DIV滚动至浏览器顶部位置固定

    获取元素(这里定位元素A)距离顶部的高度,接着设定scroll滚动的事件,比如超过那个高度,把A的位置设定为fixed,小于该高度,修改回relative. 方法一: $(function() { v ...

  2. div滚动到页面顶端后固定住

    <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title> ...

  3. JS 实现DIV 滚动至顶部后固定

    JS 实现DIV 滚动至顶部后固定 <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8" ...

  4. 获取DIV与浏览器顶部相聚一定位置之后移动DIV

    获取元素(这里定位元素A)距离顶部的高度,接着设定scroll滚动的事件,比如超过那个高度,把A的位置设定为fixed,小于该高度,修改回relative. 方法一: $(function() {  ...

  5. jquery页面滚动,菜单固定到顶部

    // 菜单固定 $(function(){ //获取要定位元素距离浏览器顶部的距离 var navH = $("#topp").offset().top; //滚动条事件 $(wi ...

  6. div固定在浏览器的最上方,不随滚动条滚动

    #topDIV { position: fixed; ; ; width: 100%; height: 35px; border-bottom: 1px solid #eee; background- ...

  7. jQuery 滚动条 滚动到底部(下拉到底部) 加载数据(触发事件、处理逻辑)、分页加载数据

    1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...

  8. jquery 文字滚动大全 scroll 支持文字或图片 单行滚动 多行滚动 带按钮控制滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. JQuery Div scrollTop ScrollHeight

    jQuery 里和滚动条有关的概念很多,但是有三个属性和滚动条的拖动有关,就是:scrollTop.scrollLeft.scrollHeight.其中 scrollHeight 属性,互联网上几乎搜 ...

随机推荐

  1. nodejs的第五天学习笔记

    一.调试nodejs代码 1)使用console.log() 使用麻烦,用了以后还要删除 2)nodejs的自带调试器 -node debug a.js 没有任何作用,一个玩具,将来有一天可以会变得强 ...

  2. PUTTY用密钥登陆服务器

    1.puttygen生成private_key和public_key,保存private_key: 2.在 ~/.ssh/authorized_keys中添加public_key,(vi ~/.ssh ...

  3. adb pull apk

    adb shell pm list packages adb shell pm path com.tence01.mm find -name *.apk adb pull /data/app/com. ...

  4. plist基本操作

    重要概念:某些路径下“只能读,不能写”的原因 iPhone.ipad真机上 Resouces文件夹:是只读的,无法写入. document 和temp文件夹:可读,可写. 一.工程结构

  5. 有关sublime text的插件安装

    .sumblime text 中的package control 插件包控件的安装步骤一:    Ctrl+` 调出console    粘贴代码: import urllib2,os; pf='Pa ...

  6. Sprint1(第四天11.17)

    Sprint1第一阶段 1.类名:软件工程-第一阶段 2.时间:11.14-11.23 3.选题内容:web版-餐厅到店点餐系统 4.团队博客地址: http://www.cnblogs.com/qu ...

  7. PHP5.3.3+Apache2.2.16+MySQL5.1.49

    轻松配置PHP5.3.3+Apache2.2.16+MySQL5.1.49,下面是有详细的步骤说明.   第一步:下载安装的文件 1. MySQL:下载地址mysql-5.1.49-win32.msi ...

  8. CentOS 7 配置静态IP

    1.查看MAC地址 2.修改/etc/sysconfig/network-scripts/ifcfg-[第一步中红框内的文字] 3.添加和修改内容如下: 4.修改/etc/resolv.conf 5. ...

  9. SQL Server中Text和varchar(max)数据类型区别

    SQL Server中Text和varchar(max)数据类型区别   以前只知道text和image是可能被SQL Server淘汰的数据类型,但具体原因不太清楚,今天读书的时候发现了text与v ...

  10. flex上下固定中间滚动布局

    传统 pc 端中,子容器高度超出父容器高度,通常使用 overflow:auto 可出现滚动条拖动显示溢出的内容,而移动web开发中,由于浏览器厂商的系统不同.版本不同,导致有部分机型不支持对弹性滚动 ...