Jquery DIV滚动至浏览器顶部后固定不动代码
$(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滚动至浏览器顶部后固定不动代码的更多相关文章
- Jquery DIV滚动至浏览器顶部位置固定
获取元素(这里定位元素A)距离顶部的高度,接着设定scroll滚动的事件,比如超过那个高度,把A的位置设定为fixed,小于该高度,修改回relative. 方法一: $(function() { v ...
- div滚动到页面顶端后固定住
<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title> ...
- JS 实现DIV 滚动至顶部后固定
JS 实现DIV 滚动至顶部后固定 <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8" ...
- 获取DIV与浏览器顶部相聚一定位置之后移动DIV
获取元素(这里定位元素A)距离顶部的高度,接着设定scroll滚动的事件,比如超过那个高度,把A的位置设定为fixed,小于该高度,修改回relative. 方法一: $(function() { ...
- jquery页面滚动,菜单固定到顶部
// 菜单固定 $(function(){ //获取要定位元素距离浏览器顶部的距离 var navH = $("#topp").offset().top; //滚动条事件 $(wi ...
- div固定在浏览器的最上方,不随滚动条滚动
#topDIV { position: fixed; ; ; width: 100%; height: 35px; border-bottom: 1px solid #eee; background- ...
- jQuery 滚动条 滚动到底部(下拉到底部) 加载数据(触发事件、处理逻辑)、分页加载数据
1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...
- jquery 文字滚动大全 scroll 支持文字或图片 单行滚动 多行滚动 带按钮控制滚动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JQuery Div scrollTop ScrollHeight
jQuery 里和滚动条有关的概念很多,但是有三个属性和滚动条的拖动有关,就是:scrollTop.scrollLeft.scrollHeight.其中 scrollHeight 属性,互联网上几乎搜 ...
随机推荐
- Android中实现全屏、无标题栏的两种办法
在进行UI设计时,我们经常需要将屏幕设置成无标题栏或者全屏.要实现起来也非常简单,主要有两种方法:配置xml文件和编写代码设置. 1.在xml文件中进行配置 在项目的清单文件AndroidManife ...
- zabbix3.0.4 部署之九 (zabbix3.0.4 Linux Agent安装)
1.从官网现在源码镜像 http://nchc.dl.sourceforge.net/project/zabbix/ZABBIX%20Latest%20Stable/3.2.1/zabbix-3. ...
- eclipse: The superclass "javax.servlet.http.HttpServlet" was not found 解决方案
解决步骤: 1. 安装Tomcat8.5 Server 2. eclipse 新建Tomcat 8.5 Server 3. 配置build path 添加 Server Runtime 1.右键项目 ...
- RapidJson读取json文档
Json格式定义如下 Object: { _Name:_Data,... } 最后一项后面没有逗号 Array: [_Data,_Data,...] 最后一项后面没有逗号 _Name: String ...
- Android开发环境搭建(jdk+eclip+android sdk)
在开启Android 开发之旅之前,首先要把准备工作做好---搭建开发环境 一.环境搭建: 1.Java JDK 安装 2.Eclipse 安装 3.Android SDK 安装 4.ADT安装 5. ...
- php知识案列
n个不重复的随机数生成代码 <?php //range 是将1到100 列成一个数组 $numbers = range (1,100); //shuffle 将数组顺序随即打乱 shuffle ...
- WC项目
#include <stdio.h> #include <string.h> int *getCharNum(char *filename, int *totalNum); i ...
- SSM框架学习之高并发秒杀业务--笔记5-- 并发优化
前几节终于实现了这个高并发秒杀业务,现在问题是如何优化这个业务使其能扛住一定程度的并发量. 一. 优化分析 对于整个业务来说,首先是分析哪些地方会出现高并发,以及哪些地方会影响到了业务的性能.可能会出 ...
- [转]MYSQL高可用方案探究(总结)
前言 http://blog.chinaunix.net/uid-20639775-id-3337432.htmlLvs+Keepalived+Mysql单点写入主主同步高可用方案 http://bl ...
- [转载] 百度上传&下载脚本
下载百度网盘中的文件,最简单的办法是使用wget命令.找到百度网盘文件,点击下载,然后找到相应的下载地址,复制链接地址即可.但这种方法有一个bug,因为百度云网盘访问文件的链接地址是动态的,当文件比较 ...