Nivo Zoom: jQuery Image Zoom / Lightbox Plugin

 

Nivo Zoom is an easy to use simple jQuery plugin that lets you display larger or full size image like a lightbox. Its main feature is easily enabling you to specify position of the larger image relative to the thumbnail. Nivo Zoom is a cross browser plugin and has been tested in following browsers: Internet Explorer 7+, Firefox 3+, Google Chrome 4, and  Safari 4.

Nivo Zoom is really easy to implement with very simple markup. All you need to do is wrap a thumbnail image in a link pointing to the image that you want to “zoom” in to and give this link the class “nivoZoom”. You can also add a caption to the zoomed image by adding a div with the class “nivoCaption”.

Read the rest of this entry »

 

Video JS: HTML5 Video Player

 

Video JS is a JavaScript based video player that uses the HTML5 video functionality built into modern browsers. It uses JavaScript and CSS to provide fully customizable video controls, enabling consistent look between browsers.

Video JS supports H.264, Theora OGG and WebM video formats and deliver native HTML5 video in modern browsers. In older browsers it will fallback to Flowplayer.

Read the rest of this entry »

 

EasyTabs jQuery Plugin

 

EasyTabs is jQuery plugin that allows you to create highly customized tabs. You can use this plugin to create custom tab layouts, such as tabs below the content, tabs on the side, etc). Instead of styling and arranging your tabs for you, EasyTabs handles only the functionality of the tabs, and leaves the styling to you.

EasyTabs does not style your tabs in any way (via JavaScript or CSS); it provides you complete control over the customization of appearance, layout, and style. It also allows you to easily customize its behavior, by providing several configuration options.

Read the rest of this entry »

 

Create Horizontal or Vertical Content Slider With Tiny Carousel

 

Tiny Carousel is a lightweight jQuery plugin that enables you to easily create highly customizable content sliders. You can create multiple horizontal and vertical content sliders in single page. Tiny Carousel is a cross browser plugin that works in all major browsers including IE6.

Tiny Carousel requires you to add content for the slider using an unordered list and offers several customization options to change its default behavior.  Additionally it offers a callback function that is executed after every slide change for further customization.

Read the rest of this entry »

 

Create Alphabetical Navigation Bar With SliderNav

 

SliderNav is a jQuery plugin that lets you create sliding vertical navigation bar. Although it is primarily meant for alphabetical listing, you can easily use it for other types of list as well. It will automatically add the navigation and sets the height for the container. The plugin has been tested and works in all modern browsers: Firefox, Chrome, Safari, Opera, and IE 7+.

Implementation is fairly easy with very simple markup (uses nested unordered lists) and call to the jQuery function. You can customize the look and feel of your navigation bar using CSS. By default, it will generate an alphabetical navigation that uses all 26 letters; however you can specify your own custom items using configuration option.

Read the rest of this entry »

 

jQuery Flip Plugin

 

Flip is a jQuery plugin, that lets you add flipping effect to an element in your page. You can use this plugin to flip an elements in all four directions . In addition to jQuery, it requires jQuery UI library. Flip is cross browser plugin that works in Firefox, Chrome/Chromium, Opera, Safari and IE (6,7,8).

Implementation is fairly easy with very simple markup and call to the jQuery function. In addition to creating the flip effect, it lets you specify new content for the flipped box. Other configuration options let you secify background color and animation speed. For more advanced customization, it provides three callback functions executed before, after and in the middle of flip effect.

Read the rest of this entry »

 

Pikachoose: jQuery Image Gallery

 

Pikachoose is a lightweight jQuery plugin that allows you to easily create photo galleries with customization options for slideshows, navigation buttons, and auto play. It also allows you to add more than one image gallery in a single page. Pikachoose is a cross browser plugin that works in all major web browsers.

Pickachoose is requires simple markup (an unordered list containing images and captions) and is very easy to implement.  You can customize the look and feel of your gallery / slideshow by modifying CSS. It also offers configuration options enabling you to customize various features.

Read the rest of this entry »

 

ProtoFluid: Website Layout Testing For Various Devices

 

ProtoFluid is a web based prototyping application that lets you test your website prototypes in various screen sizes and orientations. It supports “Media Queries” enabling you to design for CSS3 compliant (mobile) browsers. It is really easy to use, and only requires a modern browsers to work.

To test your prototype all you need to do is: type the URL you wish to test, select a device (or custom dimensions) and press launch. If you have a local web server, you can even test URLs on your local machine. Since it is web based tool, it lets you use your favorite browsers tools such as Firebug.

Read the rest of this entry »

 

Formee: CSS Framework For Forms

 

Formee is a CSS framework just for styling form elements and creating form layout. It uses Fluid 960 Grid System technique to compose the layout, providing you total flexibility to put it in any website. It also helps you create standard compliant forms with less but more markup semantic markup.

Formee will create form structure built around percentage widths, making it flexible to adapt to the width available for the form. It provides a separate CSS file for style, making it is really easily to fully customize and / or update the look and feel of form element.

Read the rest of this entry »

 

HTML5 Unleashed: Tips, Tricks and Techniques

 

Can we use HTML5 today? What can we do with it? Is it really going to kill Flash? You must have noticed a gradual increase in the frequency of these and similar questions being asked, debated and even answered. In my opinion, you must answer such fundamental questions yourself.

The whole purpose of this article is to help you get started with some basic guidelines and easy to follow code templates. If you are familiar with the basics and want to take things to the next level, you will also find several useful resources providing more tips, tricks and techniques.

Read the rest of this entry »

 
 

Stay Updated, Subscribe to RSS Feed

 
 
 
 

Blogroll

 

Sponsored Links

  • List MLS Multiple Listing Service
  • BlueHost coupon