Creative Web & UI Designer

20 Killer Image Sliders & Carousels

Whenever I am developing a new website or WordPress theme, I try and look for new kind of content sliders and carousel scripts (that can scroll images & HTML content). Over a period of time, I have bookmarked some efficient sliders that can also be easily integrated into WordPress if you have the skills. I am sure these will be helpful to both moderate and advanced developers alike. Here is the list :-

1. SPROING!

This is a lively script that make your images grow in size whenever someone hovers their cursor over the thumbnails.

2. EASY SLIDER JQUERY PLUGIN

An easily configurable content slider plugin for JQuery that supports both horizontal and vertical scrolling. I have used this for my last Premium theme – Freedom.

3. FLOOM

This is the prettiest of them all! It uses Mootools to beautifully transition between images and overall a very cutting-edge image slider.

4. LIGHTWEIGHT JQUERY CONTENT SLIDER

This is another JQuery slider plugin with the lightest footprint of only 380Kb. A great option if you quickly need to integrate a slider into your website.

5. AUTOMATIC IMAGE SLIDER WITH CSS & JQUERY

A nifty styled Image slider using CSS and JQuery script. This can be used quickly by just replacing the images with your own.

6. JQUERY PAGER PLUGIN

This is another content scroller with navigation links to scroll between slides – hence the name, Pager.

7. IMAGE ROTATOR

A great way to display portfolio pieces, E-Commerce product images, or even as an image gallery.

8. ANYTHING SLIDER

This is a HTML content slider that comes with both navigation tabs, scrolling arrows, autoplay feature and much more.

9. JQUERY CODA SLIDER

This is an accessible ‘Coda’-like slider interface that also allows you to place links to the sliding content anywhere on the page and have the effect (and navigation) still work.

10. S3SLIDER

A very sleek content slider that scrolls transparent, layered content over your images.

11. FEATURED CONTENT SLIDER

With this slider, you can show off the best content of your website or blog in a nice intuitive way that will surely catch more eyeballs.

12. MOVING BOXES

With zooming panels (in/out) and scroller buttons, this content slider is a total winner!

13. SLIDING BOXES & CAPTIONS

This script lets you make animated boxes with sliding layers of content on mouseovers. Very neat looking!

14. GALLERYVIEW

GalleryView aims to provide JQuery users with a flexible, attractive content gallery that is both easy to implement and a snap to customize. You can even create your themes for this slider if you wish to do so.

15. JQUERY SCROLLABLE

The purpose of this library is to make it extremely easy to add scrolling functionality to a website. Whenever you wish to scroll HTML elements in a visually-appealing manner, this is the only library you need. It scrolls with mouse clicks and even with mouse wheel scrolling action.

16. CAROUSEL WORDPRESS PLUGIN

This is actually a WordPress plugin that lets you insert a content slider into your posts or pages with ease.

17. JQUERY EASY SLIDES

Possibly the easiest to use JQuery plugin for making slideshows!

18. LOOPED SLIDER

Again, a JQuery based slider that lets you display images and content in the form of slides. It uses little dots for navigation.

19. YOXVIEW

YoxView is a free image and video viewer for websites. It’s written in javascript using JQuery and is available as a JQuery plugin.

20. SLICK SLIDESHOW

This is a slick and web accessible slideshow widget for your site using HTML, CSS, and JavaScript (JQuery). The site also includes the tutorial where you can learn to do this yourself.

text souce :

http://www.blogohblog.com/20-killer-image-sliders-carousels/

40+ Tool tips Scripts With AJAX, JavaScript & CSS

By Vitaly Friedman

Web users love informative clues. Whatever questions and misunderstandings might occur – delivering precise answers immediately is the primary task a responsive user interface should be able to cope with. To do that, developers have to consider subtle and well-thought tooltips – used correctly, they can greatly improve user experience and help users to get things done. In Web such “responsive” hints can be provided by tooltips. E.g., unclear input fields in web forms are perfect examples of a situation you might be willing to use a tooltip for.

Most of solutions are JavaScript- and AJAX-based, however we’ve also managed to find some lightweight CSS-based solutions. To install and use the script, it’s often enough to include the JavaScript library in the source code and provide the hint as plain text within the “title”-attribute. Sometimes you can also insert URLs, images, tables and further elements – basically, it can be almost everything you’d ever wanted it to be.
We’d like to thank Jurgen Koller for compiling an extensive list of tooltip scripts we’ve stumbled upon during our search. It gives many useful pointers, but we’ve managed to find some more. You might be willing to use Koller’s post as a quick reference for your search.
Let’s take a look at 43 handy tooltips scripts for intuitive and well-designed visual clues. It’s nice to have them all in one place, once you need them. It’s nice to be able to find them, once you don’t have time to search for them.

(Smashing's side note: Have you already bought the brand new Smashing Book #3? The book introduces new practical techniques and a whole new mindset for progressive Web design. Get your book today!)

Tooltips: AJAX & JavaScript Solutions

Nice Titles Revised
An improved Nice Titles Tooltip Script with Accesskeys support.
A lightweight prototype based JavaScript tooltip
Nice Titles
A classic. The script uses a background image.
AJAX-enabled Help-BalloonsHelp windows in baloon-design. AJAXified version is also available.
jTip – A jQuery Tool Tip
Extensive AJAX-based tooltips with numerous functions and presentation possibilities.
jQuery plugin: Tooltip
Enhances the jQuery Library.
qTip
Works for all elements, not only for links in most browsers – IE 5.5+, Firefox, Safari and Opera.
Form field hints with CSS Tooltips
t’s a basic example of how helpful a little JavaScript and CSS can be in a form. Instead of the input hints always showing and potentionally cluttering a very simple form, only the hint for the currently focused input will show. This article will show a way to do this.
JS Tooltip
Displays customizable tool tip message for each link element on a web page. A tool tip that can be added to the anchor element unobtrusively by adding a class value to it. This was done by having the tool tip message pull from the specific title attribute of the anchor element that the tool tip was added too.
BoxOver
Flexible DHTML-Tooltipp in numerous formats. Appears (almost) immedately and fades in during loading.
SuperNotes
Converts footnotes to tooltips. Appears immediately and can be assigned with a fixed position in the browser window.
Tipster
Multifunctional tool tips with JavaScript.
5 Tooltips by DHTMLGoodies
First version is suppose to improve the usability of online forms:
The second technique uses AJAX.
Walter Zorns JavaScript, DHTML Tooltipps
These tooltips can be used for different purposes; the code is well-documented and can easily be improved and modified.
clueTip
This is a demo page for the new clueTip — a jQuery-based, AJAX-powered tooltip. The clueTip plug-in was inspired by Cody Lindley’s jTip script.
Mootools Tooltip
Mootools Javascript example of using tooltips.
Sweet Titles
JavaScript Fading Tooltips.
Hover Tip
Tooltip with menu-like capabilities. The tooltip layer will remain visible while the viewer hovers over it. This allows you to place clickable links inside tooltip content.
Multiline Tooltip with HTML, CSS and JavaScript
This document explains how to make nice multiline tooltip for HTML documents, using simple and standard CSS, HTML and JavaScript.
overLIB
This JavaScript-library can be used in a variety of ways; many positioning and appearance features are available.
Scriptaculous Effect.Tooltip
The tooltip script from the script.aculo.us library.
Tooltip.js
Tooltipps with AJAX. The library uses the Prototype JavaScript Framework. The demo doesn’t work any longer.

CSS-Based Solutions

CSS Tooltips
A simple demonstration of using custom CSS tooltips as a drop-in replacement for the browser-based title attribute.
CSS Technique for Tooltips
CSS can create “faux tooltips” much the same as the JavaScript ones, but without all the (possibly) undesirable scripting. There are a few in’s and out’s involved, but surprisingly, the methods are rather easy to accomplish.
Unobtrusive and Slightly Accessible CSS Tool Tips on Semi Transparent CSS Menus
The scripts creates half-transparent tooltips with shadows.
CSS Menu Descriptions
This is a CSS technique that could be useful if you want to give users accessible added content such as tool-tips, notifications, or alerts, without adding unnecessary clutter to your page. And since it doesn’t rely of JavaScript, it should be useful to everyone, even disabled users.
Balloon Tooltip Demonstration
Balloon tooltip demonstration.
CSS Tooltipps, lixlpixel Javascript Tooltips
Similar scripts from the same source:
CSS Rollovers for Tooltips
CSS Bubble Tooltips
This example will show you how well this tooltip stretches for long descriptions.
Pure CSS Tooltips I
Simple, accessible “more” links – v2
CSS-based solution for displaying tooltips.
$Tooltips Scripts - Simple, accessible \$
CSS Tooltips
Another solution, based only on CSS.
Information Balloon PopUps
Stu Nicholls delivers another CSS-based solutions.

Further Solutions

Snap.com
Snap gives you a visual preview of each result before you click on it. And that improves your odds of picking the right search, without clicking back-and-forth several times.
DHTML Tooltips
Popup a help tip or information layer onmouseover using this object-based DHTML tooltip code. The basic version, presented on this page, can contain plain text or rich html, images, or images and text. The tooltip can be displayed over a background image. It can move with mouse movement. And it is easy to customize and modify.
Animated Tooltip Javascript
DOM Tooltip
DOM Tooltip Script-Library
Yahoo! UI Library: Tooltip
The Yahoo! UI Library Toolbox provides among other functions also tooltips.

Tooltips: WordPress-Plugins

WP – Bubble Tooltips (Plugin)
A WordPress-Plugin can change the appearance of links. Based on Bubble Tooltipps developed by Web-Graphics.
FancyTooltips
Further WordPress-Plugin with similar functionality.
Fancy Tooltips