最新文章专题视频专题问答1问答10问答100问答1000问答2000关键字专题1关键字专题50关键字专题500关键字专题1500TAG最新视频文章推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37视频文章20视频文章30视频文章40视频文章50视频文章60 视频文章70视频文章80视频文章90视频文章100视频文章120视频文章140 视频2关键字专题关键字专题tag2tag3文章专题文章专题2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章专题3
当前位置: 首页 - 科技 - 知识百科 - 正文

用jQuery实现页面滚动(Scroll)效果的完美方法

来源:懂视网 责编:小采 时间:2020-11-27 20:17:52
文档

用jQuery实现页面滚动(Scroll)效果的完美方法

用jQuery实现页面滚动(Scroll)效果的完美方法:以前很多博主都写过/转载过用 jQuery 实现页面滚动(Scroll)效果的方法,但目前搜来的方法大都在 Opera 下有个小 Bug:直接用跳的而且画面闪烁。今天,超级低调的高手 Willin 共享了一种完美方法解决 jQuery 实现滚动效果在 Opera 下的bug,我随即
推荐度:
导读用jQuery实现页面滚动(Scroll)效果的完美方法:以前很多博主都写过/转载过用 jQuery 实现页面滚动(Scroll)效果的方法,但目前搜来的方法大都在 Opera 下有个小 Bug:直接用跳的而且画面闪烁。今天,超级低调的高手 Willin 共享了一种完美方法解决 jQuery 实现滚动效果在 Opera 下的bug,我随即

以前很多博主都写过/转载过用 jQuery 实现页面滚动(Scroll)效果的方法,但目前搜来的方法大都在 Opera 下有个小 Bug:直接用跳的而且画面闪烁。

今天,超级低调的高手 Willin 共享了一种完美方法解决 jQuery 实现滚动效果在 Opera 下的bug,我随即调试+应用到我目前的主题,目前经过测试非常完美,特意贴出代码加以说明。

因为本人不太懂 js,jQuery 也只是皮毛,原理方面我说不清楚,只能说明修改方法。

演示:点击现在的主题 zOM 底部的“Δ”/文章页面标题下面的“x comments” “Leave a comment”

假设:你的主题最上面的 id 是 header,最下面的“返回顶部”的 id 为 top

jQuery 代码如下:

document$

 windowopera ? documentcompatMode ? $ $ $

$
scrollTop $top 
 false

说明:直接看注释

$('#top').click(function(){...}); 这是滚动基本代码,可以根据自个情况变通,也就是举一反三了,如:既然可以返回顶部,那么就可以滚动到底部、滚动到某一个 id、滚动到中间……

那么我再贴出一个滚动到“评论框”的例子:

例子前提假如:文章标题下面有个“添加评论”,原来的html如下

<p id="add-comment"><a href="#respond"></a></p>

(注:#respond 是评论框的 id)

那么 $('#top').click(function(){...}); 这段代码就变为如下:

$
scrollTop $top 
 false

这样就行了,简单不?有些朋友说原理,学jQ去吧

更多的方法去 Willin 的《頁面 Scroll 的幾種方法》

声明: 本文采用 BY-NC-SA 协议进行授权 | ZWWoOoOo
转载请注明转自《用 jQuery 实现页面滚动(Scroll)效果的完美方法》

阅读全文
类别:Javascript 查看评论

文档

用jQuery实现页面滚动(Scroll)效果的完美方法

用jQuery实现页面滚动(Scroll)效果的完美方法:以前很多博主都写过/转载过用 jQuery 实现页面滚动(Scroll)效果的方法,但目前搜来的方法大都在 Opera 下有个小 Bug:直接用跳的而且画面闪烁。今天,超级低调的高手 Willin 共享了一种完美方法解决 jQuery 实现滚动效果在 Opera 下的bug,我随即
推荐度:
标签: 方法 页面 实现
  • 热门焦点

最新推荐

猜你喜欢

热门推荐

专题
Top