新闻§资讯NEWS

jquery实现淡入淡出效果实例

作者:管理员 来源:本站 浏览数:3503 发布时间:2011-5-11 22:09:06

互联网上的很多这种代码都是差不多的,下面是我经过试用后整理的一些jQuery的淡入淡出效果。这些jQuery插件将帮助您快速地将效果部署于您的网站或应用上。

 

1.Jquery 淡入淡出

代码地址:http://hv-designs.co.uk/2009/01/19/jquery-fade-infade-out/

介绍:这里包括了文字、图片的淡入淡出效果,包括间个图片效果,多个图片效果。
演示:在线演示
效果图:


 2.jquery 幻灯效果
代码地址:http://jonraasch.com/blog/a-simple-jquery-slideshow
介绍:jquery实现的幻灯效果,说明很详细的,效果也不错,网站页面也很酷。
演示:http://jonraasch.com/blog/a-simple-jquery-slideshow
下载:simple-jquery-slideshow
3.CrossSlide

代码地址:http://www.gruppo4.com/~tobia/cross-slide.shtml

介绍:corssslide是jquery的一个插件来强化js幻灯、图片切换等效果的,可以媲美于flash实现的图片变换效果。

演示:http://www.gruppo4.com/~tobia/cross-slide.shtml

下载jquery.cross-slide

4.Fade transition plugin for jQuery

代码地址:http://www.robpoyntz.com/blog/?p=223

说明:jquery的一个插件,实现了图片的幻灯切换,可以用做新闻头条。

演示地址:http://www.robpoyntz.com/blog/?p=223

下载fadeNavigation

5.Supervised

代码地址:http://www.buildinternet.com/project/supersized/

介绍:也是jquery的一个插件,可以实现多种效果,并且参数可以灵活地配置。

演示地址:

http://www.buildinternet.com/project/supersized/default.php

http://www.buildinternet.com/project/supersized/slideright.php

下载supersized.1.0

6.PictureSlides

代码地址:http://www.robertnyman.com/picture-slides/implementation.htm

介绍:可以用作图片集,点击图片进行切换,效果还是不错的。纯js实现的,没有任何flash代码,如果与php结合后,实现的效果将会很棒的。

演示地址:http://www.robertnyman.com/picture-slides/demo-packages/gallery/index.html

下载picture-slides-gallery-demo

7.jQuery Cycle Plugin

代码地址:http://malsup.com/jquery/cycle/

说明:集成了几种图片的效果,不错。

演示地址:http://malsup.com/jquery/cycle/

下载jquery.cycle

8.图片集插件

代码地址:http://spaceforaname.com/galleryview

说明:超级棒的图片集

演示:http://spaceforaname.com/gallery-customized.html

下载galleryview-2.0

9.PikaChoose

代码地址:http://pikachoose.com/

说明:多家公司在用这个效果。

演示:http://pikachoose.com/demo/

下载PikaChoose_3.0

10.s3Slider

代码地址:http://www.serie3.info/s3slider/index.php

说明:图片的文字注释效果不错。

演示地址:http://www.serie3.info/s3slider/demonstration.html

下载s3SliderFull

11.InnerFade with JQuery

代码地址:http://medienfreunde.com/lab/innerfade/

说明:很简单实用的效果,包括图片与文字。

演示:http://medienfreunde.com/lab/innerfade/

下载jquery.innerfade

本文作者:万广互联

本文地址:http://www.wang0214.com/news/55.html

版权所有 转载时必须以连接形式注明作者和原始出处

已有0条评论,点击发表评论最新评论

发表评论

验证码: 点击切换验证码 看不清楚?
深圳品牌网站建设咨询热线:15013631202
150 1363 1202
158 1685 8308
深圳网站制作公司