div跟随页面滚动
$(document).ready(function(){
var timer;
$(window).scroll(function (){
clearInterval(timer);
var topScroll=getScroll();
var topDiv="100px";
var top=topScroll+parseInt(topDiv);
timer=setInterval(function(){
//$(".test").css("top", top+"px");
$("#splitsuspend_div").stop(true).animate({"top":top},50);
},50)
})
})
function getScroll(){
var bodyTop = 0;
if (typeof window.pageYOffset != 'undefined') {
bodyTop = window.pageYOffset;
} else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') {
bodyTop = document.documentElement.scrollTop;
}
else if (typeof document.body != 'undefined') {
bodyTop = document.body.scrollTop;
}
return bodyTop
}
div跟随页面滚动的更多相关文章
- div随页面滚动遇顶固定的两种方法(js&jQuery)
一.遇顶固定的例子 我一直以为是某个div或层随屏幕滚动,遇顶则固定,离开浏览器顶部又还原这样的例子其实不少,其实它的名字叫“层的智能浮动效果”.目前我们在国内的商业网站上就常常看到这样的效果了.例如 ...
- jQuery实现浮动层跟随页面滚动效果
helloweba.com Author:月光光 Time:2010-11-29 09:02 Tag: jquery 滚动 在本文中,我将介绍一个可以跟随页面滚动的层效果,当用户滚动鼠标滚轮或者 ...
- js实现浮动框跟随页面滚动,最后停留在原来位置
左边悬浮的二维码会跟随页面向上或者向下滚动,最后停留在原来的位置. <div style="background:red; width:1000px; height:7000px; m ...
- Jquery当div超出页面时就固定到顶部否则跟随页面滚动
$.fn.smartFloat = function () { var position = function (element) { var top = element.position().top ...
- Javascript实现页面滚动时导航智能定位
遇到的问题: 在做官网的时候,需要滚动定位的区块的图片不确定,无法确定用户浏览区域对应的模块导航 之前的解决方案是: 通过定位滚动条的位置来判断用户浏览区域对应的模块导航,这种方法的弊端是,区块的高度 ...
- 跟随屏幕滚动层、遮罩层、获取Div相对定位、整个屏幕、html文档的jquery基本操作
一.层跟随屏幕滚动 <div style="width:120px;height:120px;border:1px solid red; position:absolute; left ...
- javascript实现页面右侧在线客服始终跟随鼠标滚动而上下滚动且始终位于屏幕中间
效果如图,右侧的联系一栏始终位于页面的中间位置,且随着页面的上下滚动而滚动跟随 css的话没什么好说的,看图 代码 window.onload=window.onresize=window.onscr ...
- Jquery几行代码解决跟随屏幕滚动DIV
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示;当页面滚动到起始位置时,头部div出现,底部div隐藏
设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...
随机推荐
- 003_关于IntellJ IDE 2016 1. 4的使用
IDEA 全称 IntelliJ IDEA,是java语言开发的集成环境,IntelliJ在业界被公认为最好的java开发工具之一,尤其在智能代码助手.代码自动提示.重构.J2EE支持.各类版本工具( ...
- 不写完不回家的TreeSet
TreeSet详解 继承架构图: |——SortedSet接口——TreeSet实现类 Set接口——|——HashSet实现类 |——LinkedHashSet实现 ...
- 2D空间中判断一点是否在三角形内
要注意如果是XY坐标轴的2D空间,要取差乘分量z而不是y. 实现原理是,将三角形ABC三个边(AB,BC,CA)分别与比较点判断差乘,如果这3个差乘结果表示的方向一致,说明就在三角形内. 效果: 代码 ...
- 28-React state提升、组件组合或继承
Lifting State Up state提升 对于在React应用程序中更改的任何数据,应该有一个单一的数据源.通常,都是将state添加到需要渲染的组件.如果其他组件也需要它,您可以将其提升到最 ...
- 历尽磨难之PL/SQL链接Oracle数据库
说起来都是泪啊,上司布置的任务需要远程连接Oracle数据库,说实话这又是我人生中的第一次.我听到以后觉得不是什么大问题,然而我错了..错的很厉害! 我搞了一天一夜才弄好,这里面原因有很多,大体来讲还 ...
- .zip版初次安装mysql时遇到的my.ini、服务无法启动以及设置登录密码的问题
下载mysql出现的问题 若下载的是.zip版,就是免安装的直接解压就可以的出现的问题 一.需要在E:\mysql\mysql-5.7.14-winx64目录下手动添加my.ini文件(.ini文件是 ...
- Java开发中经典的小实例-(打印输入重复的值)
import java.util.ArrayList;import java.util.Scanner;public class Test8 { public static void main( ...
- TensorFlow支持windows了
(留坑)找个时间测试一下. 终于来了,TensorFlow 新增官方 Windows 支持
- 该用 QGraphicsView ? QtQuick-QML ?
目前QtQuick (2014/3/6) 已经发展了有一段时间了,很多人在用因此我也想看看是否适合我目前的项目. 我要做的是一个类似3DMax中的材质编辑器的东西,里面有成千上万的”表单“(不知道怎么 ...
- jquery了解
jQuery 库 - 特性 jQuery 是一个 JavaScript 库. jQuery 是一个 JavaScript 函数库. jQuery 库包含以下特性: HTML 元素选取 HTML 元素操 ...