background preloader

37 More Shocking jQuery Plugins

37 More Shocking jQuery Plugins
Apr 09 2008 It’s really amazing to see what one can create using jQuery. Developers just don’t stop making incredibly interactive web applications every now and then. This post just demonstrates excellent examples of some of the best jQuery plugins out there. You can also take a look at the other jQuery Plugins in this series : So let’s get started and don’t forget to subscribe to our RSS-Feed to keep track on our next post. jQuery Sliders 1) Slider Gallery- A similar effect used to showcase the products on the Apple web site. Live Demo: Here 2) Accessible slider- Illustrations and code samples showing how to make a slider UI control accessible to those who aren’t running JavaScript or CSS. Live Demo: Here jQuery Manipulating Images 3) crop, labelOver and pluck-Crop-Gives your visitors the power to crop any image on the fly using JavaScript only. Live Demo Of Crop: HereLive Demo of LabelOver: Here Live Demo Of Crop: Here Live Demo: Here jQuery Navigation Menus jQuery Accordions jQuery Image Viewer

Create A Vertical Scrolling News Ticker With jQuery and jCarousel Lite News Ticker is a fantastic way to present headlines or minor updates to your readers. The smooth scrolling effect will attract your readers and generate more clicks to your site. I am writing this tutorial as there are readers ask about this after they read my tutorial about content slider. There are a lot of great tutorials discussing on how to implement news ticker, however most of the tutorials that i found are not really suitable for a beginner. Why i choose jCarousel Lite? Let’s start to create our news ticker using jCarousel Lite. Step 1 Let’s create a blank index.htm file, and include jQuery and jCarousel Lite. Step 2 In the same document, create a <div> and name it as “newsticker-demo”. Step 3 In the “newsticker-jcarousellite” <div>, create an <ul> element. <li><div class="thumbnail"><a href="#"><img src="images/1.jpg"></a></div><div class="info"><a href=" Step 4 The script itself is pretty straight forward. Step 5 Finish! That’s all!

jQuery plugin: Tablesorter 2.0 Author: Christian Bach Version: 2.0.5 (changelog) Licence: Dual licensed (just pick!)under MIT or GPL licenses. Please with sugar on top! Update! Helping out! Comments and love letters can be sent to: christian@tablesorter.comchristian at tablesorter dot com. tablesorter is a jQuery plugin for turning a standard HTML table with THEAD and TBODY tags into a sortable table without page refreshes. tablesorter can successfully parse and sort many types of data including linked data in a cell. Multi-column sorting Parsers for sorting text, URIs, integers, currency, floats, IP addresses, dates (ISO, long and short formats), time. TIP! To use the tablesorter plugin, include the jQuery library and the tablesorter plugin inside the <head> tag of your HTML document: tablesorter works on standard HTML tables. Start by telling tablesorter to sort your table when the document is loaded: $(document).ready(function() { $("#myTable").tablesorter(); } ); NOTE! jQuery Browser Compatibility

45+ Fresh Out of the oven jQuery Plugins Mar 05 2008 Two month ago we’ve presented the 50 favorite jQuery plugins many developers use and we promised that the second version will be coming soon. Today, we are going to introduce 45+ more jquery plugins that were recently created, so you don’t have to do the search as we did it and will continue to do it to build a useful library of jquery plugins and solutions. Image SlideShows and Galleries 1) Galleria -Is a javascript image gallery written in jQuery. 2) jQuery Multimedia Portfolio -Non obstrusive and accessible portfolio supporting multiple media : photos, video (flv), audio (mp3), will automatically detect the extension of each media and apply the adapted player. 3) wSlide -Change your lists in animated box (with pagination) Tag Clouds 4) Hover Sub Tags- Using jQuery to reduce the size of the tag cloud that you have on your sites, for example if you have Ajax as a tag, you can have jquery, mootools, etc… as sub-tags. Pagination Navigation 7) jQuery Treeview Plugin Tables and Grids

Jquery | Auto-Playing Content Slider Based on Coda Slider plugin for jQuery, tutorial on how to create a slick Auto-Playing Content Slider with different types of custom content in the panels, auto-play functionality and arrow indicator to serve as a visual indication of which panel you are currently viewing. 25 Free jQuery Photo Gallery / Albums with Tutorials 30 Free Photo Gallery / Albums with Tutorials Details Category: Webdev Hits: 20172 jQuery image galleries and albums are very common on portfolio sites and are also useful for any other type of site for displaying images and photos. In this post we’ll see tutorials and plugins that can provide you with the resources that you need to get a gallery of slider on your site. Since they are already so popular I believe you don’t need me to tell you more about it. A Cool Instagram “Gravity” Gallery This will be a script that runs a search on Instagram, fetches and displays the photos in a grid, and then uses the Box2D library to simulate physical interactions between them. {ads1} Fresh Sliding Thumbnails Gallery with jQuery and PHP In this tutorial we are going to create another full page image gallery with a nice thumbnail area that scrolls automatically when moving the mouse. Thumbnail Grid With Expanding Preview Photo Booth Strips With Lightbox Free jQuery Photo Gallery ( Tutorial ) Trip Tracker

jQZoom Evolution| siti web,siti internet Macerata,siti internet Ancona JQZoom is a javascript image magnifier built at the top of the popular jQuery javascript framework. jQzoom is a great and a really easy to use script to magnify what you want. Works on all modern browsers: - 2011.05.03: jQzoom Evolution 2.3 released Installation Upload all files and directories from the jQzoom package to your server.The current package includes the JS,CSS,IMAGES folders. Note: If you decide to rename folders or to change the directory structure,take a look a the image paths inside the CSS and remember to specify the correct file paths in your calling page. Add first the last jQuery release, then the jQZoom script(don't forget this),the correct order is important.Look at the installation code below. Add jqzoom.css to your header. How to use Using jQZoom is easy,but you need to specify the HTML anchor element,that is going to generate the zoom revealing a portion of the enlarged image. SMALLIMAGE.JPG: Represents the small image you would like to zoom. Multiple thumbnails support

50+ Amazing Jquery Examples- Part1 Dec 20 2007 * This post is regularly updated. * Many of us have been using a good deal of jQuery plugins lately. Menu 1) LavaLamp 2) jQuery Collapse -A plugin for jQuery to collapse content of div container. 3) A Navigation Menu- Unordered List with anchors and nested lists, also demonstrates how to add a second level list. 4) SuckerFish Style Tabs 5) jQuery UI Tabs / Tabs 3 – Simple jQuery based tab-navigation 6) TabContainer Theme – JQuery style fade animation that runs as the user navigates between selected tabs. Accordion 7 ) jQuery Accordion Demo 8) Simple JQuery Accordion menu SlideShows 9) jQZoom- allows you to realize a small magnifier window close to the image or images on your web page easily. 10) Image/Photo Gallery Viewer- allows you to take a grouping of images and turn it into an flash-like image/photo gallery. Transition Effects 11) InnerFade – It’s designed to fade you any element inside a container in and out. 13) Highlight Fade jQuery Carousel Demo : Color Picker 17) jQuery Color Picker

37 Phenomenal jQuery Plugins and Demos for Developers In this post we have collected 37 jQuery plugins for use in your next web project. Slide-In Contact Form Description : When the user clicks on the Contact link at the top of the page, the contact form will slide down. Virtual jQuery Keyboard Description : This tutorial will explain how to implement a simple virtual keyboard with some with jQuery. Digg style sign up form Description : Simulate a Digg style signup form, with its unique features such as their dynamic tooltips that give you a hint on each field that is to be filled. Load Content While Scrolling With jQuery Description : If you have lots of content to present but can not load all of it at once as it may take too long, this plugin is the answer. Pirobox jQuery Lightbox Description : You can create a very elegant photo gallery page with this plugin, watch as the images slide in and out. FancyBox Facebox 1.2 Description : Facebox is a jQuery-based, Facebook-style lightbox which can display images, divs, or entire remote pages. jGoogle

Related: