40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一


Posted in Javascript onDecember 31, 2011

以其语法简单灵活而大受Web designer欢迎。所以很多网页设计师结合jQuery的强大功能制作出了许多成熟的图片滑动插件,我们可以很简单地直接将这些图片滑动插件嵌入到网页中,很容易就得到了即酷又实用的jQuery图片滑动效果。从这篇文章开始到接下来的几篇文章我们将向大家分享40多种非常有用,又有创意的jQuery图片滑动插件,及其演示和下载地址。你可以按你网页风格找到合适的jQuery图片滑动插件,然后点击演示链接查看具体效果,然后下载此jQuery滑动插件。希望你能在这40个jQuery图片滑动插件中找到你想要的。

1 FlexSlider

(Demo演示 | Download下载)

FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果。适合所有初级和高级网页设计师使用。

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
jQuery图片滑动切换插件 - Flexslider

2 Bubble Slidershow Effect with jQuery

(Demo演示 | Download下载)

基于jQuery的泡泡图片滑动切换效果。Bubble Slidershow是一个很有意思的jQuery图片滑动切换插件。它通过泡泡效果来进行图片切换,动态效果很特别。非常适合做风景等照片的切换展示。Bubble Slidershow的代码是模块化的,你可以按你的需求随意修改。

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
jQuery图片滑动切换插件 - 泡泡效果

3 Responsive Image Gallery with Thumbnail Carousel

(Demo演示 | Download下载)

这个图片滑动切换插件非常适合用于照片的切换显示,它使用Elastislide的缩略图。用户可以点击缩略图或左右按钮显示对应的图片。另外它支持用户点击键盘的左右方向键切换图片。

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
jQuery图片滑动切换插件 - 照片浏览

4 Circular Content Carousel with jQuery

(Demo演示 | Download下载)

这个图片滑动切换插件合适用于步骤讲解,或产品介绍。当用户点击More按钮时当前内容会移动到最左边,然后显示一个文本框用于显示更多信息。并且可以点击左、右按钮切换内容。

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
jQuery图片滑动切换插件 - 滑动及弹出层

5 Lateral On-Scroll Sliding with jQuery

(Demo演示 | Download下载)

这个插件其实已经超越了图片滑动切换的功能。它的作用是用户可以点击按钮,然后自动向上或向下滑动定位到网页的某个位置。网页的内容分成左右两栏,插件的滑动很流畅。可以用于时间线的定位。

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
jQuery图片滑动切换插件 - 时间轴动态滑动

6 jScrollPane实现隐藏滚动条效果

(Demo演示 | Download下载)

这个滑动插件也是广义的滑动效果插件,它的作用是用于隐藏页面的滚动条。只有当用户鼠标移动到内容上方时才会出来滚动条。

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
jQuery图片滑动切换插件 - 隐藏滚动条

7 Timelinr

(Demo演示 | Download下载)

跟第5个插件很类型,它是一个基于时间线的jQuery滑动插件。你可以自定义它的滑动速度,透明度等效果。同时运行横向和纵向两种滑动切换模式。

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
jQuery图片滑动切换插件 - 时间轴动态滑动

8 SmartGallery

(Demo演示 | Download下载)

SmartGallery是一个非常出色的照片滑动切换展示的jQuery插件。它支持12种不同的图片过渡切换效果。并有小缩略图。

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
jQuery图片滑动切换插件 - 照片浏览效果

9 Xml Driven Vertical News Scroller Script Vscroller

(Demo演示 | Download下载)

读取Xml的新闻纵向滚动效果。Vscroller可以用于新闻滚动显示的效果。它通过读取一个XML文件,并通过其漂亮的效果表现出来。

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
jQuery图片滑动切换插件 - 新闻滑动滚动效果

10 PushUp

(Demo演示 | Download下载)

这个插件的功能也已经超越图片滑动切换的范畴。它的作用是当网页需要弹出一个新层来展示更多内容时,它可以固定显示在网页的左边或右边,以展示更多的内容。

40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
jQuery图片滑动切换插件 - 弹出固定层

原文来自 http://www.techolics.com

Javascript 相关文章推荐
javascript 面向对象编程 万物皆对象
Sep 17 Javascript
JavaScript删除指定子元素代码实例
Jan 13 Javascript
JS脚本根据手机浏览器类型跳转WAP手机网站(两种方式)
Aug 04 Javascript
JS实现黑色风格的网页TAB选项卡效果代码
Oct 09 Javascript
javascript对象的创建和访问
Mar 08 Javascript
JQuery中attr属性和jQuery.data()学习笔记【必看】
May 18 Javascript
JavaScript 中 avalon绑定属性总结
Oct 19 Javascript
详解jQuery简单的表单应用
Dec 16 Javascript
Vue.js双向绑定操作技巧(初级入门)
Dec 27 Javascript
JS实现的Object数组去重功能示例【数组成员为Object对象】
Feb 01 Javascript
js实现计时器秒表功能
Dec 16 Javascript
详细谈谈JavaScript中循环之间的差异
Aug 23 Javascript
js 遍历对象的属性的代码
Dec 29 #Javascript
js当一个变量为函数时 应该注意的一点细节小结
Dec 29 #Javascript
为JavaScript类型增加方法的实现代码(增加功能)
Dec 29 #Javascript
javaScript 利用闭包模拟对象的私有属性
Dec 29 #Javascript
Jquery中删除元素的实现代码
Dec 29 #Javascript
js的表单操作 简单计算器
Dec 29 #Javascript
javascript写的简单的计算器,内容很多,方法实用,推荐
Dec 29 #Javascript
You might like
PHP抽象类 介绍
2012/06/13 PHP
浅谈php serialize()与unserialize()的用法
2013/06/05 PHP
php最简单的删除目录与文件实现方法
2014/11/28 PHP
PHP获取文件行数的方法
2015/06/10 PHP
微信公众平台开发教程⑤ 微信扫码支付模式介绍
2019/04/10 PHP
JavaScript程序设计之JS调试
2015/12/09 Javascript
一道优雅面试题分析js中fn()和return fn()的区别
2016/07/05 Javascript
利用React-router+Webpack快速构建react程序
2016/10/27 Javascript
Bootstrap下拉菜单Dropdowns的实现代码
2017/03/17 Javascript
基于VUE选择上传图片并页面显示(图片可删除)
2017/05/25 Javascript
bootstrap treeview 树形菜单带复选框及级联选择功能
2018/06/08 Javascript
JS判断用户用的哪个浏览器实例详解
2018/10/09 Javascript
js的对象与函数详解
2019/01/21 Javascript
详解小程序input框失焦事件在提交事件前的处理
2019/05/05 Javascript
vscode 使用Prettier插件格式化配置使用代码详解
2020/08/10 Javascript
js实现贪吃蛇游戏 canvas绘制地图
2020/09/09 Javascript
python实现k均值算法示例(k均值聚类算法)
2014/03/16 Python
pandas系列之DataFrame 行列数据筛选实例
2018/04/12 Python
pandas值替换方法
2018/07/10 Python
pyhanlp安装介绍和简单应用
2019/02/22 Python
布隆过滤器的概述及Python实现方法
2019/12/08 Python
Pycharm 2020.1 版配置优化的详细教程
2020/08/07 Python
让IE可以变相支持CSS3选择器
2010/01/21 HTML / CSS
利用CSS3的transition属性实现滑动效果
2015/08/05 HTML / CSS
Missguided美国官网:英国时尚品牌
2018/01/18 全球购物
路德维希•贝克(LUDWIG BECK)中文官网:德国大型美妆百货
2020/09/19 全球购物
药剂专业自荐信范文
2014/04/16 职场文书
村党的群众路线教育实践活动工作总结
2014/10/25 职场文书
普通员工辞职信范文
2015/05/12 职场文书
盗窃案辩护词
2015/05/21 职场文书
解决Maven项目中 Invalid bound statement 无效的绑定问题
2021/06/15 Java/Android
如何用python清洗文件中的数据
2021/06/18 Python
MySQL学习必备条件查询数据
2022/03/25 MySQL
Win11安全功能升级:内置防网络钓鱼功能
2022/04/08 数码科技
Redis基本数据类型Zset有序集合常用操作
2022/06/01 Redis
使用Apache Camel表达REST服务的方法
2022/06/10 Servers