开发者社区> 落雨_> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

43个多图片轮转jquery插件

简介: 在网页设计中,在一个有限的空间中让用户可以通过左右滚动的方式来浏览多张图片,是我们常用到的一种控件。下面我们将为您介绍43个多图片轮换播放jQuery教程和插件。 1. rCarousel 2.
+关注继续查看

在网页设计中,在一个有限的空间中让用户可以通过左右滚动的方式来浏览多张图片,是我们常用到的一种控件。下面我们将为您介绍43个多图片轮换播放jQuery教程和插件。

1. rCarousel

img_ab2614b746a91410860ded74b630c6c5.jpg

2. AgileCarousel

Implement your slideshow with the Agile Carousel JQuery plugin.Highly customizable so you can build according to yourrequirements. JSON data format is used to provide easierintegration with external data or data from your CMS. Use it foragile web development. This is an all new version written fromscratch. JQuery UI effects and the ability to read files on theserver are no longer included. New features are added, such as“Control Sets” which allow for a more customizable setup. Nowposted on Github for faster development.
img_abcca45254058887a58bc2a68302d5b6.jpg

3. jCarousel

jCarousel is a jQuery plugin for controlling a list of items inhorizontal or vertical order. The items, which can be static HTMLcontent or loaded with (or without) AJAX, can be scrolled back andforth (with or without animation).
img_f771b8562307e8021047304daf9b9993.jpg

4. TinyCarousel

Tiny Carousel is a lightweight carousel for sliding html basedcontent. It was built using the javascript jQuery library. TinyCarousel was designed to be a dynamic lightweight utility thatgives webdesigners a powerfull way of enhancing a websites userinterface.
img_f0225e4c28d7c86798ffed80a1472b1f.jpg

5. Theatre

Elixon Theatre is an extensible carousel/slideshow-like JQueryplugin supporting multiple animation effects. Works with images orany other type of rich formatted HTML contents. A best choice forportfolios, news tickers, image showcases and more. It provides youthe freedom of custom controls. You can design your own controls asyou like. Or you can use inbuilt support for button templates. Justcreate a button template and point Elixon Theatre to your buttontemplate using the paging property.
img_33c2f831edac6b499fa1046f485d99b5.jpg

6. StepCarousel Viewer

Step Carousel Viewer displays images or even rich HTML by sidescrolling them left or right. Users can step to any specific panelon demand, or browse the gallery sequentially by stepping through xnumber of panels each time. A smooth sliding animation is used totransition between steps. And fear not in taming this script to goexactly where you want it to- two public methods, two custom eventhandlers, and three “status” variables are here for that purpose.Some highlights of this script:
img_fd4bea6a35550e27e324e1a607ce968e.jpg

7. CloudCarousel

There are some attractive Adobe Flash based solutions for this typeof UI component, and while JavaScript versions exist (see this andthis), the commercial Flash products tend to have better aestheticsand polish. To redress the balance in JavaScript’s favour, I havecreated this jQuerycarousel plugin.
img_da9cde360fb9882bad6b195b2236ad0e.jpg

8. JqueryMS Carousel

Why again a new jQueryCarousel? Well… I am not competing with another carousel but ofcourse it has so many features.
img_ee713c8c68a37da8ff59084aee3f9c63.jpg

9. Barousel

Barousel is a jQuery plugin to easily generate simple carouselswhere each slide is defined by an image + any type of relatedcontent.
img_de2f91fcd555b17e25d5ef50114df415.jpg

10. jCarouselLite

jCarousel Lite is a jQuery plugin that carries you on a carouselride filled with images and HTML content. Put simply, you cannavigate images and/or HTML in a carousel-style widget. It is superlight weight, at about 2 KB in size, yet very flexible andcustomizable to fit most of our needs.
img_6101def70fb046bb968950fddf9d8d4e.jpg

11. bxSlider

img_aa14e312bf59645f46572cb48c9e5fee.jpg

12. jQuery.carouFredSel

jQuery.carouFredSel is a plugin that turns any kind of HTML elementinto a carousel. It can scroll one or multiple itemssimultaneously, horizontal or vertical, infinite and circular,automatically or by user interaction.
img_2892d7dbf8c0d68707f2b2aea054405d.jpg

13. 3DCarousel

Created a 3D Carousel from a list of images, with reflections andanimated by mouse position.
img_9220e8b1080f663a4ca4396399256915.jpg

14. InfiniteCarousel jQuery

Around the beginning of this month I released version 1.0.1 of theInfinite Carousel jQuery plugin. About a week later I received anemail asking if I could add the ability for a visitor to jump to aspecific image in the carousel. I’d seen this functionality inother carousels (none that run in infinite loops) where smallimages or some other user interface was displayed that allowedsomeone to pick an image and go directly to it. At first I thoughtsure, how hard could it be to enable this? If the current carouselcould flow infinitely picture by picture, how difficult could it beto fast forward to a specific image in the sequence? Little did irealize what I was in for.
img_47df79d8f859c5ef1c45983e14754f34.jpg

15. Sandbox

This plugin was commissioned by a client. The code base for thecarousel came from a Cnet who generously provide an Open Source MITlicense. Please use the comments to make suggestions for updatedversions, or contact me directly.
img_7eaff5a477fcf5b07bf8c48538fc60a9.jpg

16. jQueryFeature Carousel

This plug-in was intended to be used to display feature stories ona home page of a website, but can be used for any reason and ishighly customizable. It will always display three images at thesame time, with all the rest hidden behind the center image. I havedetailed instructions for using the plug-in, as well as a list ofall the options and some frequent questions. If you have anyquestions about the carousel, please post a commentbelow.
img_cc3e3c38b9f1d34500c331ee82773fea.jpg

17. jQueryLiquid Carousel plugin

Liquid carousel is a jQuery plugin intended for liquid designs.Every time the container of the carousel gets resized, the numberof items in the list change to fit the new width.
img_64761b51714e5d9a7e4eab067fab9192.jpg

18. jQueryCarousel

img_678f6a8e983e50d217a7d4ec2afd8771.jpg

19. imBannerRotater

I created simple JQuery plugin that rotates images on a page.Actually, there are three modes: random, rotate, carousel, andportfolio. In the default mode, random, the plugin will display arandomly selected image. In the rotate mode, the plugin will rotateimages on a page (fading in/out). In this mode, you can select thespeed of the rotation. In the carousel mode, the images will moveto the left in a carousel effect. I recently added a portfolio modethat using the same carousel effect, but the images are displayeddifferently. The image data can be retrieved ajaxally (json or acomma separated list). If the data is Json, a url can be added foreach image. You can also set the image title and set whether theurl will appear in a separate window (target = ‘_blank’) or in thesame window (target = ‘_self’).
img_b9922bbb082394f6844d18111b7090ac.jpg

20. jMyCarousel

img_87a882d3e2346d8ae5cca1b8629bcc8a.jpg

21. jQueryWaterwheel Carousel

This jQuery plugin can display images with a cascading waterfalleffect. It can be positioned either horizontally or vertically, andcustom events can fired when an image rotates into the center or isclicked. The callback functions can be used to programaticallytrigger Lightbox-type effects, or load specific content intoanother region of the website. There are a lot of possibilitieshere.
img_82ceaa8f36f1d6cba0bb247d402b4285.jpg

22. Roundabout

Roundabout is a jQuery plugin that converts a structure of staticHTML elements into a highly customizable turntable-like interactivearea. (And now, not just turntables, but many shapes!)
img_51535e17fb0774661e1867b140924490.jpg

23. jQueryk3dCarousel plugin

I needed a “3D” carousel to rotate images. The currently availablejQuery plugins for this purpose were either too large, toorestricted (showing only 4 at a time is not good enough), or tooold (not working in jQuery 1.4+).
img_366e43df8f449cf35a08421ef7e13cba.jpg

24. Flash3D Carousel

At Bug Software we like jQuery and we like Flash! So we thought wecould combine them to to create some really cool stuff.
img_f981ec459855bab389dd89faeadc3743.jpg

25. iCarousel

iCarousel is an open source (free) javascript tool for creatingcarousel like widgets.
img_e1b8b58c935e5afe004f71e3f324a6af.jpg

26. RoundaboutShapes for jQuery

Roundabout Shapes provide even more paths along which yourRoundabout can move. The current version of Roundabout Shapesoffers eleven additional movements.
img_2c61c6f2730b84bfbc96ab996ea49394.jpg

27. WOWSlider

WOW Slider is a jQuery image slider with stunning visual effects(Blast, Fly, Blinds, Squares, Slices, Basic, Fade, Ken Burns,Stack, Stack vertical and Basic linear) and tons of professionallymade templates. WOW Slider is packed with a point-and-click wizardto create fantastic sliders in a matter of seconds without codingand image editing.
img_f4b9a55196dd90ac8d2f22d68e1b2a13.jpg

28. CarouselSlideshow

Carousel Slideshow is a fabulous DHTML script for the showcasing ofimages on your site. It displays images in a 3D, carousel fashion.Highlights of this script other than its stunning appearanceare:
img_b5fb357432852e3dc5c269e005a13f7b.jpg

29. jQuerycarousel plugin

I’ve recently been working on a jQuery carousel script and I’vefinally found the time to package it up as a plugin for yourconsumption. It’s been used on a number of live projects so it’sbattle tested and will run in all major browsers includingIE6.
img_406f3153213606d8f483ea63ab3719f6.jpg

30. AnythingSlider

img_c8221a7845356bfb7bc2812031c93c31.jpg

31. jQueryUI Image Carousel Plugin

The image carousel plugin is a jQuery UI plugin that displays anunordered list of images as a carousel with forward and backbuttons.
img_cad4438288b7725bbd9717e7d0a11a6e.jpg

32. Makinga Mosaic Slideshow With jQuery &CSS

When designing a product page, it is often necessary to present anumber of images in a succession, also known as a slideshow. Withthe raise of the jQuery library and its numerous plugins, there isan abundance of ready-made solutions which address this problem.However, to make a lasting impression to your visitors, you need topresent them with something they have not seen before.
img_94283b7e157aebdb2c898e338bc982d6.jpg

33. dualSlider

img_2be18e1b57914cdc32f8b87a138a117b.jpg

34. jDigiClock

jDigiClock is a jQuery plugin inspired from HTC Hero ClockWidget.
img_ea53b144e8cb37d986cb8c065ef000c6.jpg

35. Slides

Slides is a slideshow plugin for jQuery that is built withsimplicity in mind. Packed with a useful set of features to helpnovice and advanced developers alike create elegant anduser-friendly slideshows.
img_2db159e4253fcf71247ac1bc4d053045.jpg

36. Carousel

This is a carousel script for jQuery that is easily configurable ina multitude of ways. The script also includes hooks for customtransitions, should you wish to add them.
img_f0d49140c43fdf9402247ac15137103b.jpg

37. jQueryImage Cube

The image cube functionality can easily be added to a division withappropriate default settings. It then displays the images containedwithin the targetted division in a cycle every two seconds. Arandom rotation is chosen each time to move to the next image.Highlights and shadows are used to enhance the 3D effect.
img_e4d984ebea2dbf33a5cdc8b5e1ff61ce.jpg

38. FullPage Image Gallery with jQuery

In this tutorial we are going to create a stunning full pagegallery with scrollable thumbnails and a scrollable full screenpreview. The idea is to have a thumbnails bar at the bottom of thepage that scrolls automatically when the user moves the mouse. Whena thumbnail is clicked, it moves to the center of the page and thefull screen image is loaded in the background. Now the user canmove up and down and the image will get scrolled automatically,giving him the opportunity to see all of the image.
img_38c16e1cb4453fc372a584434132d072.jpg

39. HOWTO: Create a jQuery Carousel with WordPress Posts

Over the past few months I have had various requests for contentsliders and carousels that integrate WordPress posts on eachslide.
img_ee25a02376d3759986a5bc4c8c0cb9cb.jpg

40. JustAnother Carousel

img_f0b7224e3fb7ceb6a2c8e57477a9a63e.jpg

41. Makingan infinite JQuery carousel

In this tutorial we will make an infinite JQuery carousel. Inoticed that most of tutorials on how to make an infinite JQuerycarousel are quite complex, so i decided to show you how to make itmuch simpler.
img_dae5b84db2492722b4a0dc99a13d3a75.jpg

42. Supersized

Supersized is a fullscreen background slideshow built using thejQuery library.
img_90b71dc37a2a56a7f4abc1ee22579422.jpg

43. ThumbnailsNavigation Gallery with jQuery

In this tutorial we are going to create an extraordinary gallerywith scrollable thumbnails that slide out from a navigation. We aregoing to use jQuery and some CSS3 properties for the style. Themain idea is to have a menu of albums where each item will reveal ahorizontal bar with thumbnails when clicked. The thumbnailscontainer will scroll automatically when the user moves the mouseto the left or right.
img_918f8e9a45be1f7a5da3c3a9637d7b56.jpg


版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
jQuery插件实现图片墙小案例
jQuery插件实现图片墙小案例
0 0
【jquery Ajax】接口的学习与Postcode插件的使用
【jquery Ajax】接口的学习与Postcode插件的使用
0 0
DateTimePicket jQuery 日期插件,开始时间和结束时间示例
DateTimePicket jQuery 日期插件,开始时间和结束时间示例
0 0
利用JQuery上传插件Uploadify实现图片上传MongoDB并预览
利用JQuery上传插件Uploadify实现图片上传MongoDB并预览
0 0
NET MVC第七章、jQuery插件验证
NET MVC第七章、jQuery插件验证
0 0
编写自定义的JQuery插件的几个注意点
编写自定义的JQuery插件的几个注意点
0 0
关于JQuery validate表单校验插件对级联下拉框的校验问题
关于JQuery validate表单校验插件对级联下拉框的校验问题
0 0
jQuery的DOM文档对象模型,常见的事件,遍历,validate插件,自定义事件方法
jQuery的DOM文档对象模型,常见的事件,遍历,validate插件,自定义事件方法
0 0
论Jquery瀑布流做成插件的想法
现实中很多问题的根源说白了就是经济问题。
0 0
+关注
落雨_
http://js-dev.cn
文章
问答
文章排行榜
最热
最新
相关课程
更多
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载