Jquery ScrollTop不适用于固定元素 - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

jquery 用于操作动态元素的delegateon方法

delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）。...在做项目中有很多由ajax动态生成的html标签，jquery对这些标签不会响应(selector).click(function.....查看资料有的推荐使用live方法，但live在jQuery1.7中就不再建议使用，在1.9中就给删除了，改用on方法取代live方法。...jQuery官方网站声称下面三行代码是等价的 (“.btn”).live(“click”, function(){ alert(“Goodbye!”)...; }); // jQuery 1.4.3+ 这里要特别注意：$(“.jk_table”)这个对应的元素必须不是动态生成的。版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。

3.5K2 0

【前端词典】4 种滚动吸顶实现方式的比较

offsetTop 用于获得当前元素到定位父级（ element.offsetParent ）顶部的距离（偏移值）。...粘性定位 sticky 相当于相对定位 relative 和固定定位 fixed 的结合；在页面元素滚动过程中，某个元素距离其父元素的距离达到 sticky 粘性定位的要求时；元素的相对定位 relative...效果变成固定定位 fixed 的效果。...二、使用 JQuery 的 offset().top 实现我们知道 JQuery 中封装了操作 DOM 和读取 DOM 计算属性的 API，基于 offset().top 这个 API 和 scrollTop...(在 IE 中，默认坐标从(2,2)开始计算，只返回 top,lef,right,bottom 四个值) 2. offsetTop: 用于获得当前元素到定位父级（ element.offsetParent

3K6 0

您找到你想要的搜索结果了吗？

是的

没有找到

高效Web开发的10个jQuery代码片段

高效Web开发的10个jQuery代码片段在过去的几年中，jQuery一直是使用最为广泛的JavaScript脚本库。...当然了，下面的代码也能用于检测别的浏览器。...: 0 }, "slow"); 　　return false; }); 3、固定在顶部非常有用的代码片段，它允许一个元素固定在顶部。...= $win.scrollTop() 　　if (scrollTop >= navTop && !...这里是一个简单的技巧可以用于在选定输入中禁止空格键。

1.3K8 0

jQuery基础--jQuery特殊属性操作

1、index() 会返回当前元素在所有兄弟元素里面的索引。 <!...console.log($(this).index()); }); }); 　2、 1.1. val方法 val方法用于设置和获取表单元素的值...; 【案例：仿腾讯固定菜单栏案例】【案例：小火箭返航案例】固定定位 //2....{ //$("html,body").stop().animate({scrollTop:0},3000); //scrollTop为0 //$(window).scrollTop

2.4K2 0

scrollIntoView()方法导致整个页面产生偏移

最高赞给出的解决方法是：放弃使用scrollIntoView 改用scrollTop 来操作滚动条。...如果第一个父元素未定位（相对relative、绝对absolute或固定fixed），则可能需要将第二行更改为： target.parentNode.scrollTop = target.offsetTop...": target.offsetTop }, 'normal'); 这是使用 jQuery 的animate 动画函数。...animate 函数使用方法：https://jquery.cuishifeng.cn/animate.html 如果不使用 jQuery 的话，由于scrollTop 是js属性，不是css属性，...下面是一个参考例子：javascript - scrollTop animation without jquery 相关问题类似的问题和解决方法如下链接： scrollintoview-moves-the-whole-page-layout-up

5K4 0

【前端词典】4 （+1）种滚动吸顶实现方式的比较

offsetTop 用于获得当前元素到定位父级（ element.offsetParent ）顶部的距离（偏移值）。...粘性定位 sticky 相当于相对定位 relative 和固定定位 fixed 的结合；在页面元素滚动过程中，某个元素距离其父元素的距离达到 sticky 粘性定位的要求时；元素的相对定位 relative...效果变成固定定位 fixed 的效果。...二、使用 JQuery 的 offset().top 实现我们知道 JQuery 中封装了操作 DOM 和读取 DOM 计算属性的 API，基于 offset().top 这个 API 和 scrollTop...2. offsetTop: 用于获得当前元素到定位父级（ element.offsetParent ）顶部的距离（偏移值）。

2.6K3 0

jQuery 尺寸、位置操作

jQuery 尺寸、位置操作 jQuery中分别为我们提供了两套快速获取和设置元素尺寸和位置的API，方便易用，内容如下。 1.1. ...jQuery 尺寸操作 jQuery 尺寸操作包括元素宽高的获取和设置，且不一样的API对应不一样的盒子模型。语法  1.以上参数为空，则是获取相应值，返回的是数字型。...1.2. jQuery 位置操作 jQuery的位置操作主要有三个： offset()、position()、scrollTop()/scrollLeft() , 具体介绍如下: 语法 1. offset...③ 可以设置元素的偏移：offset({ top: 10, left: 30 }); 2. position() 获取元素偏移 ① position() 方法用于返回被选元素相对于带有定位的父级偏移坐标...3. scrollTop()/scrollLeft() 设置或获取元素被卷去的头部和左侧 ① scrollTop() 方法设置或返回被选元素被卷去的头部。

1.7K2 0

JQuery第三节

Table of Content 1. jQuery特殊属性操作 1.1. val方法 1.2. html方法与text方法 1.3. width方法与height方法 1.4. scrollTop与scrollLeft...多库共存 1. jQuery特殊属性操作 1.1. val方法 val方法用于设置和获取表单元素的值，例如input、textarea的值 //设置值 $("#name").val(“张三”); //获取值...【案例：仿腾讯固定菜单栏案例】【案例：小火箭返航案例】 1.5. offset方法与position方法 offset方法获取元素距离document的位置，position方法获取的是元素距离有定位的父元素的位置...因为获取操作的时候，会返回获取到的相应的值，无法返回 jQuery对象。 end(); // 筛选选择器会改变jQuery对象的DOM对象，想要回复到上一次的状态，并且返回匹配元素之前的状态。...作用：遍历jQuery对象集合，为每个匹配的元素执行一个函数 // 参数一表示当前元素在所有匹配元素中的索引号 // 参数二表示当前元素（DOM对象） $(selector).each(function

1.1K3 0

jQuery实现图片懒加载

()不适用于window 和 document对象，对于window 和 document对象可以使用.height()代替。...在jQuery中，获取元素高度的函数有3个，它们分别是height()、 innerHeight()、 outerHeight()。...这三个函数获取的是元素的高度，而不是元素到页面顶部的高度，要获取元素到页面顶部的高度可以用offset().top。...下面以元素element的盒模型为例来介绍它们之间的区别。 ? image.png ? image.png 只有height()函数可用于window或document对象。...获取滚动条的滚动高度值：document.documentElement.scrollTop 获取滚动条的滚动高度值： document.body.scrollTop 获取滚动条的滚动宽度值： document.body.scrollLeft

15.6K2 0

JS使用lazyload进行图片懒加载

就能实现图片的按需加载了，也就是懒加载了方法： 1.使用lazyload插件，引用jquery.js和jquery.lazyload.js 2.将img标签中的src属性赋值为加载图片，即一张临时的...loading.gif图，将真正的图片路径放在data-original属性中 3.当JS监听到该图片元素进入可视窗口时，将data-original属性中的地址存赋予到src属性中，达到懒加载的效果...= Math.ceil($(this).scrollTop()); //滚动条与页面高度 //小数点原因向上取整 var curHeight = $(this).height();...= totalHeight) { //滚动条触底加载 imgLists(pageNo++) } }) //获取数据 1.引用jQuery、jquery.lazyload...2.img中固定写法 data-original 3.

3.8K1 0

Web前端JQuery入门实战案例

选择器是jquery提供的一组方法，用来方便我们找页面中的元素，jquery选择器返回的是jquery对象。...hasClass(name)判断类 toggleClass(name)切换 css(name,value)设置单个样式 css(obj)设置多个样式 css(name)获取样式 val()方法 val方法用于获取和设置表单元素的值...()); }); 固定导航 $(function(){ $(window).scroll(function(){ if($(windwo).scrollTop() >...|| document.body.scrollTop || 0 } } offset()方法获取元素的相对于document的位置，position()方法获取相对于定义的父元素的位置...(function(){ }); 只有jquery拿到控制权，才能释放 val() text() 和 html() width height scrollTop scrollLeft offset

4.4K1 0

前端成神之路-02_jQuery

02 - jQuery 学习目标：能够操作 jQuery 属性能够操作 jQuery 元素能够操作 jQuery 元素尺寸、位置 1.1. jQuery 属性操作 jQuery 常用属性操作有三种...(详情参考源代码) 1.3. jQuery 元素操作 jQuery 元素操作主要讲的是用jQuery方法，操作标签的遍历、创建、添加、删除等操作。 1.3.1....注意：此方法用于遍历 jQuery 对象中的每一项，回调函数中元素为 DOM 对象，想要使用 jQuery 方法需要转换。语法2 ? ...注意：此方法用于遍历 jQuery 对象中的每一项，回调函数中元素为 DOM 对象，想要使用 jQuery 方法需要转换。...1.4.2. jQuery 位置操作 jQuery的位置操作主要有三个： offset()、position()、scrollTop()/scrollLeft() , 具体介绍如下: 语法 ?

3K1 0

页面中元素的吸顶

[需求] 滚动页面到顶部，实现某元素固定到顶部效果点击某个按钮，页面滚动到相应的位置滚动页面，当到达某个位置时，高亮对应的相关按钮 [元素吸顶实现方式] 关于元素吸顶效果，通过查阅相关资料和相关测试...，有三种方式（还有一种是jquery的方法，这里就不介绍了） [一、使用position:sticky] [1....sticky元素效果完全受限于父级元素，使用条件： sticky元素的父元素的overflow只能设置为visible，否则会导致没有粘滞效果 sticky元素的父元素不能设置固定的高度，否则会导致没有粘滞效果...，防止该元素变成固定定位时，脱离文档流导致的页面抖动 */ this.tabsHeight = this....= window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; let offsetTop

1.7K3 0

jQuery 尺寸、位置操作

image.png jQuery 尺寸、位置操作 jQuery中分别为我们提供了两套快速获取和设置元素尺寸和位置的API，方便易用，内容如下。...1. jQuery 尺寸操作 jQuery 尺寸操作包括元素宽高的获取和设置，且不一样的API对应不一样的盒子模型。...2. jQuery 位置操作 jQuery的位置操作主要有三个： offset()、position()、scrollTop()/scrollLeft() , 具体介绍如下: 语法代码演示...被卷去的头部 $(document).scrollTop(100); // 被卷去的头部 scrollTop() / 被卷去的左侧 scrollLeft...// }); 不能是文档而是 html和body元素做动画 }) }) 3.

1.1K2 0

jQuery笔记(3)

jQuery元素操作主要是遍历,创建,添加,删除元素操作遍历元素each() jQuery隐式迭代是对同一类元素做了相同的操作,如果想要给同一元素做不同的操作,就需要用到遍历语法1:...,domEle是每个DOM元素对象,不是jQuery对象所以想要使用jQuery方法,需要将这个DOM元素转换成jQuery对象 $(domEle) 语法2: $.each(object,...function(index, element){xxx;}) $.each()方法可用于遍历任何对象.主要用于数据处理,比如数组,对象里面的函数有2个参数:index是每个元素的索引号,element...尺寸本文由“壹伴编辑器”提供技术支持 jQuery位置位置主要有三个: offset(),position(), scrollTop()/scrollLeft()(可以获取+设置) (真的好多啊...因为scrollTop( )是可以获取和设置的,所以scrollTop(0)就是返回顶部电梯导航栏案例: 一开始把offset()记成width()了,难住了好久...

9621 0

jQuery 尺寸、位置操作

jQuery中分别为我们提供了两套快速获取和设置元素尺寸和位置的API，方便易用，内容如下。...1. jQuery 尺寸操作 jQuery 尺寸操作包括元素宽高的获取和设置，且不一样的API对应不一样的盒子模型。语法 ?...2. jQuery 位置操作 jQuery的位置操作主要有三个： offset()、position()、scrollTop()/scrollLeft() , 具体介绍如下: 语法 ? 3....2.animate动画函数里面有个scrollTop 属性，可以设置位置 3.但是是元素做动画，因此 $(“body,html”).animate({scrollTop: 0}) 代码演示 <body...被卷去的头部 $(document).scrollTop(100); // 被卷去的头部 scrollTop() / 被卷去的左侧 scrollLeft

1.5K5 0

native 嵌套H5弹出虚拟键盘遮挡界面及其input 文本框上提及其置顶显示

以下代码用于直接将文档流中的元素移动到视区内，Android5.0+有效(只测了5.0和5.1，其他未知)，IOS没测过。...获得浏览器可视区域的位置： var viewTop = $(window).scrollTop(), // 可视区域顶部 // 可视区域底部 // 不使用jQuery var viewTop = document.body.scrollTop..., // $element是保存的input elementBottom = elementTop + $element.height(); // 不使用jQuery /* 获得元素的位置信息...elementBottom = elementTop + element.clientHeight; // 元素底部位置小结一下：从上面的代码中看到其实：判断元素是否在可视区域内...// 调整视窗位置 $(window).scrollTop(value); // 调整value // 不使用jQuery window.scrollTo(0, value); // 调整value

1.4K2 0

三、jQuery属性操作

text 1、html([val|fn])，用于设置元素的...方法 1、获取滚动偏移量元素 Javascript btns[0].onclick = function () { console.log($('.scroll').scrollTop...常用写法如下： Javascript console.log($('html').scrollTop()+$('body').scrollTop()) console.log($('html').scrollTop...元素 Javascript btns[1].onclick = function () { $('.scroll').scrollTop(300) } 网页 Javascript 同样的...通常写法如下： Javascript $('html,body').scrollTop(300) $('html').scrollTop(300)

4.3K2 0

04-老马jQuery教程-DOM节点操作及位置和大小

语法结构： jQuery(html, [props]) 参数: html:用于动态创建DOM元素的HTML标记字符串，注意标签尽量闭合。...props:用于附加到新创建元素上的属性、事件和方法返回值：返回新创建标签的jQuery包装对象 // jq的 appendTo，类似DOM的appendTo方法 $("Hello</...参数: html， String类型，HTML标记代码字符串，用于动态生成元素并包裹目标元素 element， Element类型，用于包装目标元素的DOM元素。...参数 html， String类型，HTML标记代码字符串，用于动态生成元素并包装目标元素 elem， Element类型，用于包装目标元素的DOM元素示例 $("p").wrapAll("...3.4 获取和设置滚动条的宽高 3.4.1 scrollTop([val]) 概述获取匹配元素相对滚动条顶部的偏移。此方法对可见和隐藏元素均有效。

3K9 0

Jquery基础之DOM操作

先创建元素点，创建元素节点使用Jquery的工厂函数 li1=("") 　　　　　　代码返回$li1就是一个由DOM对象包装成的JQuery对象。...5、CSS-Dom操作css()、offset()、position()、scrollTop()和scrollLeft() 　　　　　　css()方法用于获取、设置元素的一个或多个属性。...scrollTop()和scrollLeft()方法用于获取元素的滚动条距顶端的距离和距左侧的距离。...方法如下:(selector).scrollTop();(selector).scrollLeft();例：　　　　　　　var scrollTop=("p").scrollTop();var scrollLeft...例： ("textarea").scrollTop(300);

6571 0

点击加载更多

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭