css：.anchor_reached { color: #0073eb; }jquery：$(window).scroll(function(event){ $(".anchor_directory").siblings().each(function(){ var this_top = $(this).attr("data-top"); if(($(‘body‘).scrollTop()) >= this_top){ $(this).addClass("anchor_reached").siblings().removeClass("anchor_reached"); } }）})/*************2018.9.16更新***************/今天测试的时候发...
一、insertBefore()如下代码：找到span标签，将span标签剪切到div的前面<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title></title><script src="../../jq-practice/jq/jquery-2.2.1.min.js"></script><script>$(function(){$(‘span‘).insertBefore($(‘div‘));});</script> </head> <body> <div>div</div> <span>span</span></body> </html>二、insertAfter()与insertBefore正好相反<!DOCTYPE html> <html...
offset()返回偏移坐标对象，包括top,left两个Number属性，像素数值$(selector).offset().top$(selector).offset().left详细scrollTop属性设置文档从文档顶部开始卷起的像素值scrollTop:10;原文：http://www.cnblogs.com/carolina/p/5463610.html
scrollTop()函数用于设置或返回当前匹配元素相对于垂直滚动条顶部的偏移。小例子：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> div.d1{ height: 900px; background: #456; } </style></head><body> <div class="d1">156</div> <script src="jquery.min.js"></script> <script> $(document).scroll(function(){ console.log($(document).scrollTop()); }) </script><...
scrollLeft和scrollTop用于获取/设置滚动条的，如下:scrollLeft(val) ;读取或设置整个页面的水平滚动条距离scrollTop(val) ;读取或设置整个页面的垂直滚动条距离如果没有传入val值则获取滚动条距离，如果有设置val则标识设置滚动条距离，还是举个栗子，以scrollTop为例，如下:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><script src="http://libs.baidu.com/jquery/1.7.1/jquery.m...
代码如下: jQuery的位置函数(offset(),innerWidth(),innerHeight(),outerWidth(),outerHeight(),scrollTop(),scrollLeft())小应用 #divShow{width:100px;height:50px;background-color:Green;display:none;} #divAd{width:100px;height:100px;background-color:Red;position:absolute;top:100px;left:100px;} //在文本框下方显示一个div，类似日历控件那样。 function showDiv(obj){ jQuery("#divShow").css("left",jQuery(o...
CSS属性值是逐渐改变的，这样就可以创建动画效果。只有数字值可创建动画（比如 "margin:30px"）。字符串值无法创建动画（比如 "background-color:red"）。 代码如下:$(#shang).click(function(){$(html,body).animate({scrollTop: 0px}, 800);});上面的代码表示滚动条跳到0的位置，页面移动速度是800。结合scrollTop实用示例： 代码如下:jQuery(document).ready(function($){ $(#shang).click(function(){ $(html,body).animate({...
本文实例讲述了jQuery中scrollTop()方法用法。分享给大家供大家参考。具体分析如下： 此方法返回或设置匹配元素的滚动条的垂直偏移量。 语法结构一: 当scrollTop()方法不带有参数的时候是返回匹配元素相对滚动条顶部的偏移量。代码如下:$(selector).scrollTop() 实例代码:代码如下:scrollTop()函数-脚本之家#div1{border:1px solid black;width:200px;height:200px;overflow:auto } #div2{height:250px;} #div3{height:48px;width:...
Web页面常常比显示该页面的浏览器窗口还要大，因为Web文档具有很多内容，往往会导致页面比浏览器还要高，有时候甚至还要宽，这迫使访问者通过滚动来查看整个页面（如图10-8所示）。当访问者滚动页面的时候，一部分文档会从视线中消失。例如，Web页面不能完全放入浏览器窗口中，文档会向左或向上滚动，因此，页面的顶部和左边都会消失在视野之内。这意味着浏览器窗口的左上角和文档的左上角并不相同。如果试图放置一个新元素，例如，...
最近做了个项目，其中有一目录功能，发现一个在现代浏览器间的一个bug，或是称之为差异，即页面滚动值(scrollTop)的获取与设定。在此之前先说一下关于页面元素的坐标获取，这张图的经典性不必再提。实现滚动到某位置功能博客目录的一个最主要的功能就是实现点击标题页面滚动，因为我们要滚动到页面某个标题，所以需要计算出滚动这个元素的具体绝对位置，而常用的offsetTop是获取到当前元素与之最近的决定其定位的元素的偏移量，此处...
jQuery中animate()的方法 用于创建自定义动画的函数。 返回值:jQuery animate(params, [duration], [easing], [callback]) 如果使用的是“hide”、“show”或“toggle”这样的字符串值，则会为该属性调用默认的动画形式。paramsOptions一组包 含作为动画属性和终值的样式属性和及其值的集合 params 对象{},注意：所有指定的属性必须用骆驼形式，比如用marginLeft代替margin-left，如果使用的是“hide”、 “show”或“toggle”这样...
Web页面常常比显示该页面的浏览器窗口还要大，因为Web文档具有很多内容，往往会导致页面比浏览器还要高，有时候甚至还要宽，这迫使访问者通过滚动来查看整个页面（如图10-8所示）。当访问者滚动页面的时候，一部分文档会从视线中消失。例如，Web页面不能完全放入浏览器窗口中，文档会向左或向上滚动，因此，页面的顶部和左边都会消失在视野之内。这意味着浏览器窗口的左上角和文档的左上角并不相同。如果试图放置一个新元素，例如，...
本文实例讲述了jQuery中scrollTop()方法用法。分享给大家供大家参考。具体分析如下： 此方法返回或设置匹配元素的滚动条的垂直偏移量。 语法结构一: 当scrollTop()方法不带有参数的时候是返回匹配元素相对滚动条顶部的偏移量。代码如下:$(selector).scrollTop() 实例代码:代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="//www.gxlcms.com/" /> <title>scrollTop()函数-脚本之家</...
CSS属性值是逐渐改变的，这样就可以创建动画效果。只有数字值可创建动画（比如 "margin:30px"）。字符串值无法创建动画（比如 "background-color:red"）。 代码如下:$(#shang).click(function(){$(html,body).animate({scrollTop: 0px}, 800);});上面的代码表示滚动条跳到0的位置，页面移动速度是800。结合scrollTop实用示例： 代码如下:jQuery(document).ready(function($){ $(#shang).click(function(){ $(html,body).animate({...
本文使用jquery的scrollTop方法监视页面垂直滚动像素，并根据像素隐藏或者显示顶部的导航条。 效果预览网址：http://www.keleyi.com/keleyi/phtml/scrolloversee.htm scrollTop的介绍： 语法 $(selector).scrollTop(offset) 参数 offset 描述 可选。规定相对滚动条顶部的偏移，以像素计。 定义和用法 scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置。 scroll top offset 指的是滚动条相对于其顶部的偏移。 如果该方法未设置...