39个超实用jQuery实例应用特效

简介: 摘要:程序员和Web设计师可以利用jQuery的诸多特性开发设计出许多光彩夺目的网站,当然这也取决于设计师们自己的创造力。 下面收集了39个开发者们最爱的jQuery应用以及教程,快来试试,让你的页面炫起来! 1.

摘要:程序员和Web设计师可以利用jQuery的诸多特性开发设计出许多光彩夺目的网站,当然这也取决于设计师们自己的创造力。 下面收集了39个开发者们最爱的jQuery应用以及教程,快来试试,让你的页面炫起来!

1.Contextual Slideout:上下文滑动特效

Contextual Slideout Tips With jQuery & CSS3

2.Revealing Photo Slider:图片幻灯片特效

Revealing Photo Slider

3.Fancy Box:魔幻盒 

Fancy Box

4.Scrollable:滚动特效

Scrollable 

 

5.Flip翻转特效,实现4个方向旋转

Flip 

6.Smart tooltips:智能提示

Smart tooltips

7.Slide tab box:幻灯片选项卡

Create slide tab box

8.Tabbed Interface/Tabbed Structure Menu:选项卡式接口和菜单

jQuery Tabbed Interface / Tabbed Structure Menu Tutorial

9.jQuery plugin: Easy Accordion:可以让自定义列表(DTs)轻松生成一个漂亮光滑的水平Accordion插件

 

10.Animate Panning Slideshow with jQuery平移幻灯片

这是一个教大家使用jQuery实现动画平移幻灯片效果的教程,学习该教程需要下载 easing animationstiming slide changes这两个插件。

Animate Panning Slideshow with jQuery

11.Blockster transition effect:Blockster过渡特效

Blockster是JavaScript里面一款非常有特色展示过度效果的应用,其核心概念就是块与块之间的过渡。

Blockster transition effect

12.Making a Custom YouTube Video Player:定制个性化的YouTube视频播放器

Making a Custom YouTube Video Player

13.Sexy Drop Down Menu with jQuery :迷你下拉菜单教程

Sexy Drop Down Menu w jQuery

14.Building a jQuery Image Scroller:构建卷条式图片

Building a jQuery Image Scroller

15.Custom Animation Banner with jQuery:动画广告图教程

Custom Animation Banner with jQuery

16.Full Page Image Gallery with jQuery:制作页面画廊

Full Page Image Gallery with jQuery

17.Randomizer App with jQuery随机数产生器

Randomizer App w/ jQuery

18.Animated Drop Down Menu with jQuery:动画下拉菜单

Animated Drop Down Menu with jQuery

19.Making an Interactive Picture with jQuery:制作交互式图片

Making an Interactive Picture with jQuery

20.A jQuery Twitter Ticker:Twitter Ticker教程

A jQuery Twitter Ticker

21.jQSlickWrap:可以让文字环绕在漂浮图片周围的jQuery插件

jQSlickWrap

22.Animated Text and Icon Menu with jQuery:制作动画文本和图标菜单

Animated Text and Icon Menu with jQuery

23.Image Wall with jQuery:图片墙

Image Wall with jQuery

24.jQuery look: Tim Van Damme

Tim的两个核心是简化版的Accordion和悬浮效果。值得注意的是,悬浮效果只能在WebKit(Safari和Chrome)上工作,本教程的关键是教你如何利用jQuery制作产生这一特效。

jQuery look: Tim Van Damme

25.How to Load In and Animate Content with jQuery:内容自动加载

在本教程中,会添加ajax函数,用户无需导航即可把内容自动加载到容器中。

How to Load In and Animate Content with jQuery

26.Nivo SliderNivo幻灯片教程

Nivo Slider

27.Coin Slider:硬币式幻灯片

Coin Slider

28.HTML5 and jQuery Techniques to Build a Webpage:使用HTML5和jQuery创建网页

HTML5 and jQuery Techniques to Build a Webpage

29.Latest Post Blogroll Slider with jQuery and PHP使用jQueryPHP创建友情链接幻灯片

Latest Post Blogroll Slider with jQuery and PHP

30.Making a Photoshoot Effect With jQuery & CSS图片拍摄特效

Making a Photoshoot Effect With jQuery & CSS

31.Coding a Rotating Image Slideshow w/ CSS3 and jQuery:旋转图片幻灯片

Coding a Rotating Image Slideshow w/ CSS3 and jQuery

32.Slider Gallery:滑块画廊

Slider Gallery

33.Making Better Select Elements with jQuery and CSS3:使用jQuery和CSS3制作更好的选择元素

Making Better Select Elements with jQuery and CSS3

34.Jquery Tutorial : Toggle Effect on Hover/Click:切换特效

Jquery Tutorial : Toggle Effect on Hover/Click

35.Creating an Animated 404 Page:动感的404

Creating an Animated 404 Page

36.Create Smooth Rotatable Images with CSS3 and jQuery:制作平滑可旋转图像特效

Create Smooth Rotatable Images with CSS3 and jQuery

37.Neon Text Effect With jQuery & CSS霓虹灯文字

Neon Text Effect With jQuery & CSS

38.Bubbleriffic Image Gallery with jQuery:Bubbleriffic图片库

Bubbleriffic Image Gallery with jQuery

39.Animated Portfolio Gallery with jQuery:动态画廊

Animated Portfolio Gallery with jQuery

来自:DesignRex

相关文章
|
6月前
|
JavaScript 前端开发 索引
JQuery样式操作、click事件以及索引值-选项卡应用示例
JQuery样式操作、click事件以及索引值-选项卡应用示例
60 1
|
6月前
|
开发框架 前端开发 JavaScript
使用JavaScript、jQuery和Bootstrap构建待办事项应用
使用JavaScript、jQuery和Bootstrap构建待办事项应用
109 0
|
6月前
|
JavaScript 前端开发
jQuery第一天---六大功能的简单应用
jQuery第一天---六大功能的简单应用
58 0
|
JavaScript 前端开发 开发者
jQuery文档对象模型DOM的实际应用
jQuery文档对象模型DOM的实际应用
53 0
|
23天前
|
JavaScript 前端开发 容器
使用 jQuery 中的 this 实例
使用 jQuery 中的 this 实例
9 1
|
2月前
|
JavaScript 前端开发
jQuery 实例
jQuery 实例
17 3
|
3月前
|
JavaScript 前端开发 容器
使用 jQuery 中的 this 实例
使用 jQuery 中的 this 实例
34 0
|
5月前
|
JavaScript 前端开发 安全
安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
安全开发-JS应用&原生开发&JQuery库&Ajax技术&加密编码库&断点调试&逆向分析&元素属性操作
|
6月前
|
前端开发 JavaScript
jquery+css实现Tab栏切换的代码实例
jquery+css实现Tab栏切换的代码实例
102 0