Browsing articles tagged with " Carousel"
Apr
8

Slider Kit – sliding contents with jQuery

By Vinod  //  All, Javascript  //  1 Comment

The purpose of Slider Kit is to gather common slideshow-like jQuery functionalities (such as news sliders, photos galleries/sliders, carousels, tabs menus) into one light and flexible plugin combined with ready-to-use CSS skins.

Features

  • Content slider with modular elements
  • Multiple navigation controls: buttons, mousewheel, image click, keyboard (beta)
  • Vertical/Horizontal navigation clip
  • Vertical/Horizontal panels slide
  • Auto scrolling / Circular scrolling
  • Fading and sliding transitions effects
  • Easing on transitions
  • Slider Kit generates a minimum of inline CSS. The whole skin is CSS-made
  • Light weight: < 8 Ko (minified)

Compatibility

  • Internet Explorer 9: yes
  • Internet Explorer 8: yes
  • Internet Explorer 7: yes
  • Internet Explorer 6: yes
  • Firefox: yes (tested on v3.6.1 & v4)
  • Chrome: yes (tested on v9.0.597.107)
  • Safari: yes (tested on v5.0.2)
  • Opera: yes (tested on v11.01)
Sep
18

CarouFredSel – infinite, circular jQuery carousel

By Vinod  //  All, Gallery, Javascript  //  1 Comment

jQuery.carouFredSel is a plugin that turns any kind of HTML element into an infinite, circular carousel. It can scroll one or multiple items simultaneously, horizontal or vertical, automatically, by pressing buttons or keys on the keyboard.

The carouFredSel-plugin was built using the jQuery-library. It is licensed under the MIT-license.

Features

  • Can scroll horizontal and vertical.
  • Scrolls one or multiple items simultaneously.
  • Scrolls automatically and/or by user interaction. With optional custom settings.
  • Dynamically add and remove items to/from the carousel.
  • Support for variable item-width and -height.
  • Built in keyboard-navigation and pagination.
  • Compatible with most popular (jQuery) lightbox-plugins.
  • Intelligent custom events and loads of options.
May
27

Cloud Carousel – A 3d Carousel in Javascript

By Vinod  //  All, Gallery, Javascript  //  1 Comment

The Cloud carousel features optional auto-reflections, and the information contained in the Alt and Title tags of the images can optionally be displayed as you hover over each image.

There are some benefits to doing this kind of thing in JavaScript rather than Flash, not least of which is the ease of integration, small file size, SEO, and inherent degradability/accessibility. Not having another dev-tool in the workflow is another plus.

The carousel features realistic perspective. Many 3d carousels only apply perspective scaling to the size of the images, not their positions. This results in disproportionate gaps appearing between items as they shrink in the distance which looks odd.

Features

  • Works with most browsers (tested on IE6+, Firefox, Chrome, Opera, Safari).
  • Accurate 3d perspective.
  • Optional auto reflections – no need to modify your images or add server code.
  • Easy integration with basic valid HTML and a tiny bit of JavaScript.
  • Small 5Kb (minified) script..
  • Degrades gracefully with Javascript turned off.
  • Fully accessible with no CSS or text only browsers.
  • Works with other plugins, e.g. Slimbox, and preserves your links and mouse events.
  • Optional mouse wheel support as of version 1.0.2.
  • It’s completely free.