首页 / JQUERY / 基于jquery的跟随屏幕滚动代码_jquery

基于jquery的跟随屏幕滚动代码_jquery

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了基于jquery的跟随屏幕滚动代码_jquery，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含10315字，纯文字阅读大概需要15分钟。

内容图文

那么这是怎么实现的呢？本文将引用乌徒帮的跟随屏幕滚动代码，对此效果做详解。
一、原始代码
下面是乌徒帮的跟随屏幕滚动代码，它的作用域为乌徒帮网页两侧的边栏，以及双击屏幕后的右侧隐藏栏。

代码如下:

 
var $catalogueOffsetTop = $('aside#catalogue').offset().top; 
var $archiveOffestTop = $('aside#archive').offset().top; 
var $archiveOffestLeft = $('aside#archive').offset().left; 
$(window).bind('scroll resize',function(){ 
// #right-area的跟随屏幕滚动效果 
if($('#right-area').height() <= $(window).height()){ 
$('#right-area').stop(true,true).animate({'top': $(document).scrollTop() + 'px'},800); 
}else if($('#right-area').height() > $(window).height() && $('#right-area').height() < $(document).height()){ 
// 这段范围内是最关键的，允许滑动 
if(($(document).scrollTop() + $(window).height()) <= $('#right-area').height()){ 
$('#right-area').stop(true,true).css('top','0'); 
}else if(($(document).scrollTop() + $(window).height()) < $(document).height()){ 
$right_top = $(document).scrollTop() + $(window).height() - $('#right-area').height(); 
$('#right-area').stop(true,true).animate({'top': $right_top + 'px'},800); 
}else{ 
$right_top = $(document).height() - $('#right-area').height(); 
$('#right-area').stop(true,true).css({'top': $right_top + 'px'}); 
//alert($(document).scrollTop() + $(window).height() - $(document).height()); 
} 
}else if($('#right-area').height() >= $(document).height()){ 
$('#right-area').height($(document).height()).stop(true,true).css({'overflow':'hidden','overflow-y':'scroll'}); 
} 
if($(document).scrollLeft() == 0){ // 只有在屏幕处于左侧的时候才进行下面的跟随滚动，同时需要注意下面的if($(window).width() > 1024)，是为了防止在小屏幕下还发生这种变化 
// aside#catalogue的上下滑动 
if($('aside#catalogue').outerHeight() < $(window).height()){ 
if($(document).scrollTop() <= $catalogueOffsetTop){ 
$('aside#catalogue').css({'position':'static','top':$catalogueOffsetTop}); 
if($(window).width() > 1024)$('#main').css({'padding-left':'0'}); 
}else{ 
$('aside#catalogue').css({'position':'fixed','top':'0'}); 
if($(window).width() > 1024)$('#main').css({'padding-left':$('aside#catalogue').outerWidth() + 5 + 'px'}); 
} 
}else if($('aside#catalogue').height() >= $(window).height() && $('aside#catalogue').outerHeight() < ($('footer').offset().top - $catalogueOffsetTop)){ 
if(($(document).scrollTop() + $(window).height()) <= ($('aside#catalogue').outerHeight() + $catalogueOffsetTop)){ 
$('aside#catalogue').css({'position':'static','top':$catalogueOffsetTop}); 
if($(window).width() > 1024)$('#main').css({'padding-left':'0'}); 
}else if(($(document).scrollTop() + $(window).height()) < $('footer').offset().top){ 
$catalogue_top = $(window).height() - $('aside#catalogue').outerHeight() - 20; 
$('aside#catalogue').css({'position':'fixed','top': $catalogue_top + 'px'}); 
if($(window).width() > 1024)$('#main').css({'padding-left':$('aside#catalogue').outerWidth() + 5 + 'px'}); 
}else{ 
$catalogue_top = $(window).height() - $('aside#catalogue').outerHeight() - 20 - ($(document).height() - $('footer').offset().top); 
$('aside#catalogue').css({'position':'fixed','top':$catalogue_top + 'px'}); 
if($(window).width() > 1024)$('#main').css({'padding-left':$('aside#catalogue').outerWidth() + 5 + 'px'}); 
} 
} 
// aside#archive的上下滑动 
if($('aside#archive').outerHeight() < $(window).height()){ 
if($(document).scrollTop() <= $archiveOffestTop){ 
$('aside#archive').css({'position':'static','top':$archiveOffestTop,'left':$archiveOffestLeft + 'px'}); 
}else{ 
$('aside#archive').css({'position':'fixed','top':'0','left':$archiveOffestLeft + 'px'}); 
} 
}else if($('aside#archive').height() >= $(window).height() && $('aside#archive').outerHeight() < ($('footer').offset().top - $archiveOffestTop)){ 
if(($(document).scrollTop() + $(window).height()) <= ($('aside#archive').outerHeight() + $archiveOffestTop)){ 
$('aside#archive').css({'position':'static','top':$archiveOffestTop,'left':$archiveOffestLeft + 'px'}); 
}else if(($(document).scrollTop() + $(window).height()) < $('footer').offset().top){ 
$catalogue_top = $(window).height() - $('aside#archive').outerHeight(); 
$('aside#archive').css({'position':'fixed','top': $catalogue_top + 'px','left':$archiveOffestLeft + 'px'}); 
}else{ 
$catalogue_top = $(window).height() - $('aside#archive').outerHeight() - ($(document).height() - $('footer').offset().top); 
$('aside#archive').css({'position':'fixed','top':$catalogue_top + 'px','left':$archiveOffestLeft + 'px'}); 
} 
} 
}else{ // 如果屏幕不处于左侧，就让这两个跟随归位 
$('aside#catalogue').css({'position':'static','top':$catalogueOffsetTop}); 
$('#main').css({'padding-left':'0'}); 
$('aside#archive').css({'position':'static','top':$archiveOffestTop,'left':$archiveOffestLeft + 'px'}); 
} 
}).scroll().resize(); 

网络上有很多相关的代码，更有7行代码解决此问题的方法，甚至还有通用性的插件来实现此效果。然而它们都太过普遍化，对于不同的网站，特殊性不同，在一些细节上要做更多的考虑。

二、选择用什么方式跟随屏幕滚动
方案有三种：

1、使用position:absolute;然后对top值进行动态赋值；
2、使用position:fixed;然后对top值进行动态赋值；
3、对padding-top或margin-top进行动态赋值；

前两种都是用到了postion对元素的位置进行安排，和float一样，position将元素从正常的文本流中拖出来。而padding或margin的方法则是控制元素的边距来实现。到底哪一种好呢？

使用position:absolute;会出现滚动时发生抖动（火狐中不会），使用padding-top时会让有背景的元素看上去难看，也会发生抖动，使用position:fixed不支持IE6，使用margin-top没有尝试过，应该会发生抖动。本段代码选择的是position:fixed，唯一不发生抖动的方案，但是在IE6下不会有该效果。

三、要考虑的情况
之所以乌徒帮要将本站的代码拿出来讲解，是因为网上的代码没有具体分析，很多问题都没有考虑到。

1、要跟随的元素的高度和屏幕的高度进行比较

网上所有的代码考虑的是该区域的高度小于窗口高度的情况，因此代码很简单。当区域高度等于和大于窗口高度时，我们又会有新的考虑。

2、如果区域高度超出窗口，何时开始跟随滚动？

这要看我们想给用户展示什么，如果是一个广告，如果是一段文字，如果是一个列表。我的设计是，当屏幕往下滚动，但是还没有将要显示的元素全部显示完整时，不进行任何效果，当屏幕滚动到元素的底部临界处时，效果触发，再往下滚动时，元素的底端和屏幕的底端对齐，元素的下部一直呈现在屏幕内。当然，不同的网页，你的设计自然不同，你也可能设计为，向下滚动时先没有效果，当滚动到某一个广告之后，这个广告和屏幕顶端对齐跟随滚动。
基于jquery的跟随屏幕滚动代码_jquery - 文章图片

图一跟随屏幕滚动逻辑设计图

从图一中我们来看一下这一设计思路。图中绿色部分为要跟随滚动的区域，灰色部分为整个网页，浅灰色部分为屏幕（能看到的区域）我们通过向下移动浅灰色的屏幕来模拟往下滚动滚动条。在①的阶段为初始阶段，这个时候网页一切照初始运作，没有任何动作。到②的阶段，屏幕向下滚动到一个临界点，即要跟随滚动区域的最低端。第③阶段是滚动过临界点之后，元素开始跟随屏幕滚动，我们可以看到，元素的底端和屏幕的底端对齐，元素的顶端已经看不到。第④个阶段的屏幕滚动到底部，可以想象，网页的底部是存在一些版权信息的，元素不能跟随滚到底部把这些信息遮住，因此在红线的地方就不再跟随滚动。

这是屏幕向下滚动的示意图，当屏幕向上滚动时，这是这个顺序的逆向。但是还有另外一个考虑，当屏幕在向上滚动时实现和向下滚动初始状的一种效果，即临界点是此时④中的绿色区域顶端，向上滚动时屏幕顶端和元素顶端对齐。出于技术难度的考虑，乌徒帮没有实现这一效果。

3、数和量的计算

在滚动时，我们要掌握好那些量是变化的，哪些又不变，在不变中找变，在变中找不变，总之要保持头脑清晰，分清如何去计算各种高度关系。

在图一中，我用了一条蓝色竖线来辅助高度计算，用红色的线指示屏幕和元素的位置，将蓝色竖线分成了a、b、c、d、e、f六段。那么他们之间有着哪些变化数量关系呢？（我们将绿色区域的元素定义为#myDiv，将版权信息在内的底部定义为#footer）

a+b+c+d+e+f=$(document).height();//文档高度，固定值

代码如下:

 
a= $('#myDiv').offset().top;//#myDiv顶部到文档顶部的初始值，随着滚动，$('#myDiv').offset().top将会变化 

b=$('#myDiv').height();//元素的高度，固定值 

a+b+c=$(window).scrollTop()=$(docment).scrollTop();//滚动条的位置，即文档顶端到当前屏幕顶端的距离，不断变化中 

d=$(window).height();//屏幕的高度，固定值 

f=$('#footer').height();//#footer的高度，固定值 

a+b+c+d+e=$('#footer').offset().top=$(document).height()-$('#footer').height();//#footer顶部到文档顶部的距离，固定值，不过需要注意的是，$('#footer').offset().top+$('#footer').height()并非一定等于$(document).height()，你要看#footer下面是否已经没有了空白。

在整个变化过程中，变化的值只有$(window).scrollTop()=$(docment).scrollTop()和$('#myDiv').offset().top，因此我们要抓住这些值之间的加减数量关系，做好逻辑判断和赋值。

4、值在什么时候获取

你可以看到，我在scroll事件之前事先获取了

代码如下:

 
var $catalogueOffsetTop = $('aside#catalogue').offset().top; 
var $archiveOffestTop = $('aside#archive').offset().top; 
var $archiveOffestLeft = $('aside#archive').offset().left; 

正是由于他们在scroll事件发生时会发生变化，因此要提前存放在变量中。

四、特殊情况特殊考虑

在写出这么多代码之前，我曾想过写出一个可以通用的代码，然而事情并非那么简单，在乌徒帮中，三个要滚动的区域都具有特殊性，因此必须认真考虑他们的事件逻辑和仔细赋值。

1、元素是否自由随意

由于乌徒帮双击屏幕滑向右侧时出现的区域是自由的，顶部和底部没有阻挡信息，因此我们的处理更方便一些，不用获取顶部距离的初始值和考虑滚到底部时空出一段。但是仍然要考虑下面第2点，屏幕和元素高度的比较。

而对于边侧栏的滚到，我们要考虑边侧栏顶部到文档顶部还有一段距离，底部还有版权信息。滚到的位置要通过上文获得的值，再配合css中获得的值进行精确计算。

2、判断元素的高度和屏幕高度之间的关系

当元素高度小的时候，我们的处理比较简单，只需要将元素顶端和屏幕顶端对齐，和上面第1点结合，也会出现不同的情况：如果元素顶部到文档顶部还有一段距离的话，我们还不能屏幕一滚动就开始让它和屏幕顶端对齐，而必须滚到它的顶端这个临界点的时候才可以开始。

而当元素的高度大于屏幕的高度的时候，我们要进行更复杂的判断，和第1点判断何时开始跟随滚动：只有当屏幕的底端和元素底端对齐时，元素开始跟随屏幕滚动。

但是还有一种情况，即元素的高度超出了我们想要的高度，我们可以使用overflow来对元素进行处理，这时我们通过元素的高度和页面中一些固定值的比较来处理这一环节。乌徒帮通过比较右侧元素的高度和底部的关系来进行overflow的处理：

代码如下:

 
...... 
}else if($('#right-area').height() >= ($('footer').offset().top + $('footer').height())){ 
$('#right-area').height($('footer').offset().top + $('footer').height()).stop(true,true).css({'overflow':'hidden','overflow-y':'scroll'}); 
} 

3、自己网页内特殊情况的变化

乌徒帮由于左右还可以滚动，因此产生了一系列问题，position:fixed时左右方向上元素的距离并没有固定值，因此在进行左右滚动时，元素会遮住滚动完的屏幕，因此我又对$(document).scrollLeft()进行了判断，进行了一些处理。

另外，乌徒帮还是一个自适应的网页设计网站，在不同宽度的屏幕上显示的效果也不同，js的特点是当屏幕发生变化时仍然起作用，因此，我也增加了屏幕宽度的判断。

总结
在跟随屏幕滚动这个问题上，原始的思路是很简单的，即通过本文列举的三种方案进行位置或距离的动态改变，然而，要在具体细节上把握好，必须对动态变化中的各个数值有所把握。于此同时，结合自己的网页，对不同情况下的动态效果有一个好的设计和规划，也是实现跟随屏幕滚动的关键环节。

内容总结

以上是互联网集市为您收集整理的基于jquery的跟随屏幕滚动代码_jquery全部内容，希望文章能够帮你解决基于jquery的跟随屏幕滚动代码_jquery所遇到的程序开发问题。如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/311034.html

来源：【匿名】

【上一篇】jQuery中hover方法和toggle方法使用指南_jquery 【下一篇】学习php+jQuery+Ajax实现点赞效果的方法

更多 ►

【基于jquery的跟随屏幕滚动代码_jquery】教程文章相关的互联网学习教程文章

jquery使用jsonp跨域请求代码示例【代码】

HTML 部分文件名：test.html 1<meta charset="utf-8"> 2<script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script> 3<script> 4function jsonpCallback(){5 alert(‘jsonpCallback‘);6 }7 $(document).ready(function(){8 $.ajax({ 9 url: "http://127.0.0.1/jsonp.php", 10 data: {username:"admin", password: "admin"}, 11 dataType: "jsonp", 12 ...

jquery动画函数里面可以跟一个回调函数，表示动画结束后执行的代码【代码】

jquery动画函数里面可以跟一个回调函数，表示动画结束后执行的代码使用js监听动画结束后进行的操作：$ele.fadeIn(300,function(){...})$ele.fadeOut(300,function(){...})$ele.slideUpDown(300,function(){...})$ele.fadeSlideUpDown(300,function(){...})原文：https://www.cnblogs.com/Knowledge-is-infinite/p/11380628.html

无刷新分页代码，jQuery分页完整示例

<!DOCTYPE html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>jQuery分页演示效果</title><script type="text/javascript" src="/ajaxjs/jquery1.3.2.js"></script><script type="text/javascript">$(document).ready(function(){ var show_per_page = 5; var number_of_items = $(‘#content‘).children().size(); var number_of_pages = Math.ceil(number_of_items/show_per_page); $(...

jQuery Tab选项卡切换代码【图】

jQuery Tab选项卡切换代码是一款简单的jquery tab标签选项卡切换代码样式，可以修改tab选项卡相关样式。下载地址：http://www.huiyi8.com/sc/10863.html（转载请注明此处）原文：http://www.cnblogs.com/lhrs/p/4208502.html

jQuery简单竖排手风琴折叠菜单代码【代码】【图】

项目需求1.刚开始只显示，每个标题， 2.让每个 li列表隔行换色 3.当我点击某个标题时，下面的列表会缓慢的展开，其他列表展开的内容会收起<!DOCTYPE html><html><head><meta charset="utf-8"><title></title><script src="js/jQuery1.8.js" type="text/javascript" charset="utf-8"></script><style type="text/css">*{margin: 0;padding: 0;}div{border: 2px red #7FFFD4;width: 200px;}h3{background-color: #7FFFD4;font-size: ...

集成框架 javaweb开发平台ssmy_m(生成代码) java struts2 mybatis spring maven jquery【图】

网页地址 http://blog.csdn.net/lpy3654321/article/details/31841573 项目设想,在项目开发中,我们的开发者大多数时间都在反复开发相同的keyword,相同的语法. 但就在这种情况下还会常常发生语法的错误,并且每一个开发者的代码风格不同. 其它人员阅读困难.新人的学习成本也会添加. 这些问题会浪费非常多时间,也会影响到开发者的心情,和程序质量. 由这些问题我想的解决方法是 <代码生成工具> . 代码生成能够解决上述...

jQuery进阶——分析拼图游戏源代码【代码】【图】

在网上看到一款拼图游戏游戏，发现它是js写成的，于是想看一下它的实现方法，经过代码去余冗和修改，我们来分析这段代码的精妙。 1. HTML部分复制网页的源代码，去掉与拼图功能无关，并根据CSS文件去掉具体内容标签，得到一个简单的HTML页面<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>jQuery拼图</title><script type="text/javascript" src="jquery.min.js"></script><script type=...

十条jQuery代码片段助力Web开发效率提升【代码】

JQuery是继prototype之后又一个优秀的Javascript库。它是轻量级的js库，它兼容CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+），jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML（标准通用标记语言下的一个应用）、events、实现动画效果，并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可...

N个必备的实用jQuery代码段

都是网上找的整理一下一起学习方便以后好用感谢各位大佬的分享！jQuery(function() { /* <input type="password" name="pass" id="pass" /> <span id="passstrength"></span>*/ //下面的正则表达式建议各位收藏哦，项目上有可能会用得着 $(‘#pass‘).keyup(function(e) { //密码为八位及以上并且字母数字特殊字符三项都包括 var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z]...

jquery ajax分页插件特效源代码demo完整版【图】

原文：jquery ajax分页插件特效源代码demo完整版源代码下载地址:http://www.zuidaima.com/share/1550463586798592.htm网上找的，原版本没有测试数据和建表脚本啥的，我给加上了。原文：http://blog.csdn.net/springmvc_springdata/article/details/41940273

JQuery插件让图片旋转任意角度且代码极其简单【代码】

引入下方的jquery.rotate.js文件，然后通过$("选择器").rotate(角度);可以旋转任意角度，例如$("#rotate-image").rotate(45);把这句放在$(document).ready(function(){ });中就是将id为rotate-image的图片旋转45度。不过，貌似在Chrome中总是不显示。唉，找了两个小时，才发现Chrome太坑爹了，没法获取图片的长宽。解决办法是，把$("#rotate-image").rotate(45);放在$(window).load(function(){ });中，因为在Chrome中图片在执行$(...

有一个列表[3,4,1,2,5,6,6,5,4,3,3]请写出一个函数，找出该列表中没有重复的数的总和、简述数据库表设计中一对一、一对多、多对多的应用场景、 char与varchar的区别、js代码书写位置有几种、js如何绑定事件、常见的事件有哪些、列举你所知道的jQuery选择器(针对表单筛选器是否有注意事项)【代码】

1.有一个列表[3,4,1,2,5,6,6,5,4,3,3]请写出一个函数，找出该列表中没有重复的数的总和def func(l): res = [] sum_s = 0 for i in l: if i not in res: res.append(i) sum_s += i return sum_slist1 = [3, 4, 1, 2, 5, 6, 6, 5, 4, 3, 3]print(func(list1)) # 212.简述数据库表设计中一对一、一对多、多对多的应用场景1、一对一可以两个实体设计在一个数据库中l例如设计学生和学生学号2...

****timeago.js插件：jquery实现几分钟前、几小时前、几天前等时间差显示效果的代码实例【代码】

前端时间个性化插件 jquery.timeago.js 关键词：时间格式化刚刚 N分钟前 N小时前 N天前 N月前 N年前 MM-dd hh:mm 或者 yyyy-MM-dd 前端： <span title="2016-07-23 12:02:32"></span> 用法： $(".time").timeago(); 插件： jquery.timeago.js !function (t) {function e(e) {var n = t.extend(o.settings, e), s = t.proxy(r, this);s(),n.refreshMillis > 0 && setInterval(s, n.refreshMillis)}function r() {var e = n(t...

jquery后台登录页面背景图片自动轮换登录界面代码【图】

在别的网站上看到的比较炫酷的Web登陆界面，背景图片可以自动轮换。介绍给大家，有兴趣的可以下来改改当做自己系统的登陆界面。如图：点击下载源代码原文：http://blog.csdn.net/lisenyang/article/details/37501427

在网页动态添加html代码时,使用jQuery调用隐藏的事件.

$(function() {　　var val;　　$("#add").live("click",function() { //使用.live("事件名称",方法) 调用隐藏的事件　　val=$(this).prev().val();　　});});原文：http://www.cnblogs.com/tan520/p/4713795.html

JQUERY - 技术教程分类

jQuery 教程 jQuery 简介 jQuery 安装 jQuery 语法 jQuery 选择器 jQuery 事件 jQuery 隐藏/显示 jQuery 淡入淡出 jQuery 滑动 jQuery 动画 jQuery 停止动画 jQuery Callback jQuery 链 jQuery 捕获 jQuery 设置 jQuery 添加元素 jQuery 删除元素 jQuery CSS 类 jQuery css() 方法 jQuery 尺寸 jQuery 遍历 jQuery 祖先 jQuery 后代 jQuery 同胞 jQuery 过滤 jQuery AJAX 简介 jQuery load() 方法 jQuery get()/post() 方法 jQuery noConflict() 方法 jQuery JSONP jQuery 实例 jQuery 选择器 jQuery 事件方法 jQuery 效果方法 jQuery HTML / CSS 方法 jQuery 遍历方法 jQuery AJAX 方法 jQuery 杂项方法 jQuery 属性 jQuery Validate jQuery Cookie jQuery Accordion jQuery Autocomplete jQuery Growl jQuery 密码验证 jQuery Tooltip jQuery Treeview jquery 全部

JQUERY - 最热教程

javascript中html字符串转化为jquerydo...js批量设置元素样式和封装似于jquery的...使用jquery获取url及url参数的方法 jQuery取消ajax请求的方法 jquery中根据获取元素的6种方法总结如何通过jQuery添加新的内容 jQuery和ajax实现鼠标单击修改内容的方...基于JSON格式数据的简单jQuery幻灯片插...jquery设置内联样式css()js调用iframe实现打印页面内容的方法_j...

首页 / JQUERY / 基于jquery的跟随屏幕滚动代码_jquery

基于jquery的跟随屏幕滚动代码_jquery

内容导读

内容图文

内容总结

内容备注

内容手机端

【基于jquery的跟随屏幕滚动代码_jquery】教程文章相关的互联网学习教程文章

jquery使用jsonp跨域请求代码示例【代码】

jquery动画函数里面可以跟一个回调函数，表示动画结束后执行的代码【代码】

无刷新分页代码，jQuery分页完整示例

jQuery Tab选项卡切换代码【图】

jQuery简单竖排手风琴折叠菜单代码【代码】【图】

集成框架 javaweb开发平台ssmy_m(生成代码) java struts2 mybatis spring maven jquery【图】

jQuery进阶——分析拼图游戏源代码【代码】【图】

十条jQuery代码片段助力Web开发效率提升【代码】

N个必备的实用jQuery代码段

jquery ajax分页插件特效源代码demo完整版【图】

JQuery插件让图片旋转任意角度且代码极其简单【代码】

****timeago.js插件：jquery实现几分钟前、几小时前、几天前等时间差显示效果的代码实例【代码】

jquery后台登录页面背景图片自动轮换登录界面代码【图】

在网页动态添加html代码时,使用jQuery调用隐藏的事件.

JQUERY - 相关标签

JQUERY - 技术教程分类

JQUERY - 最新教程

JQUERY - 最热教程