前15个jQuery滚动插件

这是15个使用jQuery来显示水平,垂直或多方向滚动效果的绝佳站点。 他们中的大多数人使用了jQuery.Scroll to plugin来创建类似Flash的滚动导航体验,而其中一些人则使用了其他独特的jQuery脚本。


1.悬崖滚轮

滚动文本内容,就像在良好的Winamp跟踪屏幕上一样。
Cliff-Scroller-.jpg
资源


2. jQuery TopLink插件

当用户在页面上向下滚动时,允许您淡入“至顶部”链接。
jQuery-TopLink-Plugin-.jpg
资源


3.使用jQuery和CSS消失“滚动到顶部”链接

本教程将帮助您构建滚动到顶部的链接,当用户向下滚动时出现,而当用户使用CSS和jQuery组合到达页面顶部时消失。
消失的“滚动到顶部”链接与jQuery和CSS-.jpg
资源


4. UItoTop jQuery插件

马特·瓦罗内(Matt Varone)做了一个类似的插件,但是有两个主要区别,这个插件不需要您添加额外的html标记或额外的插件即可使用。 它仅在打开JavaScript时有效。
UItoTop-jQuery-Plugin-.jpg
资源


5. jQuery滚动到Top Control v1.1

该脚本在窗口的右下角显示一个固定控件,单击该控件时将页面轻轻滚动回到顶部。 通过脚本,您可以在显示控件之前指定用户在页面上的向下位置(以像素为单位),而不是始终在用户的屏幕上看到该脚本。
jQuery滚动到顶部控件v1-11.jpg
资源


6.平滑的GoToTop WordPress插件

从Ariel Flesler开发的平滑滚动脚本开始,Mogosanu Bogdan为WordPress构建了一个插件。 在插件的设置页面中,可以在显示控件之前自定义css,渐变速度和最小高度(以像素为单位)。
Smooth-GoToTop-WordPress-Plugin.jpg
资源


7.滚动视差:jQuery插件

滚动视差是一个新的jQuery插件,它将视差效果绑定到滚动条和鼠标滚轮。 当用户滚动时,这允许背景图像或其他任何东西以与网页不同的速度滚动。
滚动视差-A-jQuery-插件-.jpg
资源


8. jQuery SimplyScroll逻辑框

jQuery插件可以自动或手动(水平或垂直)对一组元素进行动画处理(滚动)。 它也可以通过Flickr提要(注意未完全整合API)或本地JSON源接受动态图像输入。
jQuery-SimplyScroll-Logic-Box-.jpg
资源


9. jQuery的背景滚动效果

在本教程中,我们不仅要介绍制作方法,还将在插件中使用它,它允许用户自定义运动的速度和方向(垂直,水平和对角线)。
Background-Scrolling-Effect-with-jQuery.jpg
资源


10. jQuery和ColdFusion的无限滚动效果

这不是新的效果,但是这种“无限滚动”效果绝对是有趣的,而且您从未体验过。
jQuery和ColdFusion-.jpg的无限滚动效果
资源


11.在使用jQuery滚动时加载内容

通常,我们要呈现的内容很多,但可能一次过加载,因此无法一次加载所有内容。 在本教程中,您现在将拥有滚动时加载内容的功能,并使用jQuery创建了类似的内容。
使用jQuery-.jpg滚动加载内容
资源


12.相同页面链接的动画滚动

在本教程中,您将学习如何为相同页面的链接设置动画。
相同页面链接的动画滚动.jpg
资源


13. jQuery水平滚动新闻自动收报器

获取具有唯一ID的所有旧的无序(ul)列表,并将其转换为具有可变速度控制并且实际上还可以暂停鼠标悬停事件的简单侧滚动新闻自动收录器,从而使从栏的导航特别容易。
A-jQuery-水平滚动新闻-Ticker.jpg
资源


14.带有局部锚的滚动效果

这是为了使页面内的某些滚动效果锚定到目标。
滚动效果与本地锚点jQuery.jpg
资源


15.使用jQuery创建无限滚动效果

了解如何使用jQuery制作无限滚动效果。
使用jQuery-.jpg创建无限滚动效果
资源

From: https://www.sitepoint.com/top-15-jquery-scrolling/

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值