jVectorMap: An Interactive jQuery Map

Integrate an interactive map into your website with jVectorMap. This is a jQuery plugin which shows vector maps on HTML pages and applies SVG in all contemporary modern browsers ranging from ancient IE 6 to 8, Chrome, Opera, IE9, Safari, Firefox. All you have to do is connect Javascript and CSS files of plugin and [...]

Continue Reading →

Create a jQuery Star Comment Rating System

The commenting system just became more fun for users! Created by eligeske,  this animated jQuery star commenting system is a great way to rate your posts. Add this to your website and see your visitor activity increase. Download the ZIP FILE.   HTML (star_rating.html) <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> <html xmlns=”http://www.w3.org/1999/xhtml”> <head> [...]

Continue Reading →

Auto-Convert Text To Different Cases Using jQuery

jQuery By Example’s author created this neat plugin for automatically converting your text to upper, lower, title, and pascal case. The auto feature is just half of it, the other half is that it converts your text in REAL-TIME! Check out the live demo here or take a look at its code here. First thing [...]

Continue Reading →

Create A Grayscale Image Hover In HTML5

It used to be that shifting an image from grayscale to colored and vice-versa as you hover over it required 2 copies of the said image — one in grayscale and the other in color.  But thanks to Darcy Clarke for the JavaScript & HTML 5 grayscale in this tutorial, this feat is easier and [...]

Continue Reading →

10 Nifty Image Slideshow Effects with jQuery

Here’s a list of 10 innovative plugins to create breathtaking slideshows for your image gallery or portfolio. How to Create a Slideshow Plugin with jQuery – This slideshow makes use of a jQuery plugin called Powerslide. Elastic Image Slideshow with Thumbnail Preview – Here’s a really cool slideshow that automatically adjusts according to the size [...]

Continue Reading →

jQuery Apple Retina Effect

Recreate Apple’s Retina display with this awesome tutorial! Thanks to web developer Martin Angelov, he designed a fully functional Apple-like Retina effect using the jQuery library. Below are the steps on how to achieve this effect. 1. XHTML The markup is pretty much straight forward and has few divs and images. <div id=”main”> <div id=”iphone”> [...]

Continue Reading →

Create Sticky Notes Using HTML5, CSS3, and jQuery

Add fun and functionality to your website by adding Windows-style sticky notes! Thanks to the combined powers of HTML5, CSS3, and a bit of jQuery in this tutorial by Teylor Feliz, we can do just that. Let’s being with the HTML markup: < !DOCTYPE html>  <html lang=”en”> <head> <meta charset=”utf-8″ /> <title>Posticks</title> <link rel=”stylesheet” rev=”stylesheet” [...]

Continue Reading →

Zoom In On Your Website with ImageLens

Here’s a terrific jQuery plugin that can make viewing your website extra-fun for visitors! Created by a web developer at Dailycoding.com , ImageLens is one cool plugin that zooms in on images when you hover over them. Here’s what you will need: jQuery, image and the ImageLens plugin – jquery.imagelens.js. Check out the demo and [...]

Continue Reading →

How to Make a Fancy Progress Bar With CSS3 And jQuery

Ivan Vanderbyl ‘s cool CSS3 tutorial actually shows us a numeric representation (i.e. percentage) of how long a process is going to take in modern browsers. Below is a screenshot of the resulting product, which you can click on to view the demo. Now let’s start with the HTML. HTML Markup <!DOCTYPE html> <html> <head> [...]

Continue Reading →

How to Create CSS3 Speech Bubbles

The use of speech bubbles in web design has become so popular that it has become an integral feature in commenting. This tutorial by Nicolas Gallagher teaches us how to create our own. Many tutorials out there rely on HTML and JavaScript which, aside from being tedious to work on, don’t work well on IE5. [...]

Continue Reading →

Page 1 of 812345»...Last »