JQuery Plugins - 2
jQuery Imageless Buttons
Filed in Forms - 6 months ago
This jQuery plugin is an attempt to recreate Google's imageless buttons and prove that it doesn't take a whole team of engineers and an endless cycle of code revision and quality control (their own words) to pull this off.
Create a Content Rich Tooltip with JSON and jQuery
Filed in Animation & Effects - 6 months ago
This tutorial will demonstrate how to build tooltips that are powered by jQuery, with information pulled from a JSON array.
Special scroll events for jQuery
Filed in Events - 6 months ago
Add two new scroll events, "scrollstart" and "scrollstop" for jQuery.
Rollovers and Tooltips
Filed in Animation & Effects - 6 months ago
Shows a nice tooltip when the mouse is hovered over navigation icons.
Sliding Menu
Filed in Menus - 6 months ago
This tutorial shows you how to build a sliding menu that shows more information when the mouse is hovered over it.
Horizontal Animated Menu
Filed in Menus - 6 months ago
This tutorial teaches you how to build a basic horizontal animated menu using jQuery that shows more information about the link when mouse is moved over it.
Create Beautiful jQuery Sliders Tutorial
This tutorial explains how to develop Create Beautiful jQuery sliders tutorial with image description and name.
Scrolling Background Effect
Filed in Animation & Effects - 6 months ago
This explains how to create a nice scrolling background effect like youlove.us. The technique is actually a lot simpler than it looks, it’s based around scrolling a very tall gradient image behind some transparent PNG images. The header image has a transparent background and solid text, while the main page is actually an image with the heading text as transparent cut outs.
Visualize - Accessible Charts & Graphs
The plugin provides a simple method for generating bar, line, area, and pie charts from an HTML table, and allows you to configure them in a variety of ways.
Tokenizing Autocomplete Text Entry
Filed in Forms - 6 months ago
This is a jQuery plugin to allow users to select multiple items from a predefined list, using autocompletion as they type to find each item. You may have seen a similar type of text entry when filling in the recipients field sending messages on facebook.
SuperBox
jQuery Superbox! is a script which allows you display windows with the lightbox effect.
jQuery iFramer
Filed in Forms - 6 months ago
jQuery iFramer is a plugin made to submit forms with a hidden iframe. Say for instance you have an Impromptu popup that contains a few form fields and a file upload. The file upload is the kicker to needing such a plugin, since you can’t upload files via old fashion ajax.
jQuery Impromptu
jQuery Impromptu is an extention to help provide a more pleasant way to spontaneously prompt a user for input. More or less this is a great replacement for an alert, prompt, and confirm. Not only does it replace these but it also allows for creating forms within these controls. This is not intended to be a modal replacement, just a quick tool to prompt user input in a fashionable way.
jTwitter - Twitter API
Filed in Extensions - 6 months ago
Plugin provides you with an easy Twitter API to access Twitter user information by twitter username.
PeriodicalUpdater for jQuery
PeriodicalUpdater is a plugin for jQuery that emulates Prototype's Ajax.PeriodicalUpdater function.
The general idea is that ajax requests are sent at specified intervals, and if the data from the server doesn't change, the requests get less and less frequent. If the data from the server changes, the interval for requests is reset.
The general idea is that ajax requests are sent at specified intervals, and if the data from the server doesn't change, the requests get less and less frequent. If the data from the server changes, the interval for requests is reset.
Scroll to Top
Filed in User Interface - 6 months ago
Adds a fading scroll to top link with animated scrolling. It works like this:
If you’re already at the top of the page, the button is invisible and doesn’t fade in to view until the user starts scrolling. When they click on the link, it pulls them back to the top of the page and fades back out again.
If you’re already at the top of the page, the button is invisible and doesn’t fade in to view until the user starts scrolling. When they click on the link, it pulls them back to the top of the page and fades back out again.
AJAX File Upload Form
Filed in Forms - 6 months ago
An AJAXified multiple file upload form that uses a lot lesser server side code and also provides a very nice user interface.
Featured Content Slider Using jQuery UI
Filed in Navigation - 6 months ago
Showing off the best content of your website or blog in a nice intuitive way will surely catch more eyeballs. Using an auto-playing content slider is the one of techniques to show your featured content. It saves you space and makes for a better user experience, and if you add a pinch of eye candy to it, then there’s no looking back.
How to Make a Slideshow with a Transparent PNG Frame
Filed in Navigation - 6 months ago
Create a basic slideshow that uses a combination of PNG transparency and layered positioning to create the effect of each slides being held in by the bottom corners.
jTruncate - Text Truncation for jQuery
Filed in Utilities - 6 months ago
jTruncate provides simple yet customizable truncation for text entities in your web page.
Kwicks for jQuery
Filed in Animation & Effects - 6 months ago
Kwicks for jQuery started off as a port of the insatiably attractive Mootools effect (of the same name), but has evolved into a highly customizable and versatile widget.
Uniform - Style Select, Radio & Checkboxes
Filed in Forms - 6 months ago
A plugin for jQuery that lets you style select, radio, and checkboxes however you desire.
jqPlot
Filed in Chart & Graph - 6 months ago
jqPlot is a plotting plugin for the jQuery Javascript framework. jqPlot produces beautiful line and bar charts with many features.
How to Make a Smooth Animated Menu
Ever seen some excellent jQuery navigation that left you wanting to make one of your own? Today we’ll aim to do just that by building a menu and animate it with some smooth effects.
News Ticker
Filed in Events - 6 months ago
A nice news ticker using jQuery and just ten lines of JavaScript code.
jQuery Fade In / Fade Out
Filed in Effects - 6 months ago
Show some simple effects you can use to spice up your websites using jQuery.
Side Navigation Tooltip / Popup Bubble
Filed in Utilities - 6 months ago
A tooltip / popup bubble using jQuery.
Image Rotator with Description
An image rotator is one great way to display portfolio pieces, eCommerce product images, or even as an image gallery. Although there are many great plugins already, this tutorial will help you understand how the image rotator works and helps you create your own from scratch.
Fancy Thumbnail Hover Effect
Filed in Animation & Effects - 6 months ago
Recently I was checking out some nice flash galleries and came across an effect that I really liked. I had a sudden urge to duplicate that similar effect but using my bread and butter (CSS and jQuery). I thought I’d share this and maybe some of you can find it useful.
Simple Page Peel Effect
Filed in Animation & Effects - 6 months ago
You have probably seen these forms of advertisings where you can peel a corner of a website and see a message underneath. It seems most are flash driven, but I decided to try it out using some simple lines of jQuery.
Sexy Drop Down Menu
Studies show that top navigation tend to get the most visual attention when a user first visits a site. Having organized and intuitive navigation is key — and while most drop down menus may look aesthetically pleasing, developing them to degrade gracefully is also essential. In this tutorial I would like to go over how to create a sexy drop down menu that can also degrade gracefully.
Simple Toggle with CSS & jQuery
Filed in Menus - 6 months ago
Learn the basics of jQuery and the toggle effect.
Add Zoom Icon to Images
Filed in Animation & Effects - 7 months ago
Adds a zoom icon when you hover an image.
Advanced docking using jQuery
Filed in Navigation - 7 months ago
Some time ago I was doing some proof of concept: how Visual Studio docking functionality can be done with jQuery and unordered lists. Basically, the main goal was to implement multiple docking and undocking functionality. This tutorial will show you how.
Skype-like buttons
Filed in Forms - 7 months ago
If you use Skype I am sure that you noticed that animated button for adding more people to a chat. When you click on it the icon on the left "jumps" for a few times. I love that animation. And that's why I'm going to show you how to create the same button using jQuery and some simple CSS.
Fullsize
Filed in Animation & Effects - 7 months ago
Fullsize is an attempt to get a new ![]()
attribute called fullsize into the next version of HTML.
Polaroid Photo Viewer
Filed in Navigation - 7 months ago
Implement a polaroid photo viewer by combining the CSS3 Box Shadow and Rotate properties. When dragging a polaroid around, you'll see the shadow. When it's placed down, it's rotated to the left or the right (random).
Image Captions
Filed in Animation & Effects - 7 months ago
Adds captions to images. captions are pulled from the alt tag or the html for a specified element.
Captify
Filed in Effects - 7 months ago
Captify is a plugin for jQuery written by Brian Reavis to display simple, pretty image captions that appear on rollover. It has been tested on Firefox, Chrome, Safari, and the wretched Internet Explorer. Captify was inspired by ImageCaptions, another jQuery plugin for displaying captions like these.
Uploadify
Filed in Forms - 7 months ago
Uploadify is a jQuery plugin that allows the easy integration of a multiple (or single) file uploads on your website. It requires Flash and any backend development language. An array of options allow for full customization for advanced users, but basic implementation is so easy that even coding novices can do it.
Sliding Sidebar
Sliding sidebars that follow the user up and down the page are great for viewing what’s in your shopping cart on e-commerce sites or for site navigation.
Sliding Menu Background
Normally when you mouse over a list of links, the text/background color might change or even the background image might switch to another image. In this tutorial I will show you how to take a normal list of links and add a hover effect so that the bullet image will slide out and another image will then slide in, thus creating an very cool subtle effect.
Popup Bubble
Filed in Animation & Effects - 7 months ago
Add a cool popup bubble tooltip to an RSS feed link using jQuery.
TextArea Resizer
Allows the user to extend / resize the textarea element/area within the web page HTML form whenever they feel.
Stay on Top
Filed in User Interface - 7 months ago
"Emphasize" and make particular content on your page stand out by keeping them always visible on the visitor's browser screen, using this script. The script uses CSS's "fixed" positioning to accomplish this in modern browsers, while for older browsers that don't support "fixed" (such as IE6), switches to "absolute" positioning to simulate the effect. But the script doesn't just keep an element fixated on the screen, it lets you manage their display frequency to make the whole affair sensible and user friendly.
JSON Suggest
Filed in Forms - 7 months ago
Turn a text box into an auto suggest box which search's and displays results specified in a JSON string either on construction or dynamically. The set of results can contain images and extra details about each item. If must at least contain the text to actually search on. The chosen item can optionally be sent to a callback method and is sent as the full object it was specified as from the JSON string. You can include as many extra variables as you want as part of the result.
Supersized
Filed in Windows & Overlays - 7 months ago
A full screen background / slideshow jQuery plugin.
Content Slider using jFlow
Filed in Navigation - 7 months ago
A tutorial on using jFlow, a minimalist jQuery plugin to create a content slider.
Sliding Boxes and Captions
Filed in Widgets - 7 months ago
All of these sliding box animations work on the same basic idea. There is a div tag (.boxgrid in my css) that essentially acts as a window where two other items of your choosing “peek” through.
No comments:
Post a Comment