jPreLoader : jQuery Preloading Screen to Preload Images

July 26, 2012 | Plugins, Web
jPreLoader : jQuery Preloading Screen to Preload Images

Today I would like to share with you a brand new jQuery plugin, called jPreLoader. jPreLoadercan create a preloading screen for your website before all your images (including the images in CSS) are fully loaded. It will come in handy when you wish to preload all the images on your page before exposed to user. It’s useful for those games websites.

Well, you can also create a Splash Screen during preloading process to introduce your products, or describe about your page, or show the instructions of gameplay as well as put an advertisement during the waiting time of your user.

Read More Demo
  0 Like?

Create a Sticky Navigation Header Using jQuery Waypoints

July 25, 2012 | HTML5, Menus, Plugins
Create a Sticky Navigation Header Using jQuery Waypoints

In this tutorial, we’ll be creating a navigation bar that stays with you as you scroll down — and we’ll also throw a gimmick or two into the mix to polish it off. we’re going to use one of HTML5′s new elements, the navtag, as a container for a horizontal list of links. I’ll briefly explain how to make it look pretty using a little bit of CSS.

Most importantly, you’ll make yourself familiar with the basics of jQuery’s Waypoints plugin, which will provide advanced functionality: as the user scrolls down, the navigation bar will stick to the top of the viewport, as well as change to indicate the current section. As a little added touch, we’ll use another plugin, ScrollTo, in order to provide smooth scrolling and convenient positioning when the user clicks on the navigation links.

Read More Demo
  3 Like?

ThumbFx : Responsive jQuery Thumbnail Effects

July 25, 2012 | Animation, Image Effects, Plugins, Premium, Responsive
ThumbFx : Responsive jQuery Thumbnail Effects

Enrich your website experience with ThumbFx, a jQuery animation plugin that brings your images and content to life. Create unique animated effects effortlessly without any knowledge of jQuery. All effects are responsive and adapt perfectly for all device resolutions like mobiles, tablets and desktops

Features:

  • CREATE – Slideshows, lightboxes, overlays, tooltips, tabs, galleries, showcase and many many more..
  • SIMPLICITY – No complicated HTML structure. Use it wherever you want, however you want. Works out of the box. No need to add confusing JavaScript tags, just add the files to your pages and you can control every settings from the HTML tag.
  • RESPONSIVE – All effects are responsive and adapt perfectly for all device resolutions like mobiles, tablets and desktops.
  • CROSS -BROWSER SUPPORT – Works great with all modern browsers like Firefox, Chrome, Safari, Opera and Internet Explorer 8 and above.
Read More Demo
  3 Like?

Responsive Slider jQuery Plugin : iView Slider

July 25, 2012 | Plugins, Responsive, Slider
Responsive Slider jQuery Plugin : iView Slider

iView is easy to use jQuery image slider with animated captions, responsive layout and HTML Elements like (Video, iFrame) slider. Easily add unlimited number of slides and captions. Use it as image slider, image gallery, banner rotator, banner ads, or even presentation.

This jQuery plugin uses unobstrusive javascript to transform a block of simple HTML markup into a georgous elegant slider, which can be completely customized using HTML5 data attributes. The markup is valid HTML5 and SEO optimzied, with all content always being available to search engines. When using this plugin, your page layout will be consistent even if javascript has been disabled.

This slider includes 35 transition effects which is completely configurable and compatible with all major browsers (including ie6 to ie9, Firefox, Chrome, Opera, Safari) and mobile platforms like iOS / Android.

Read More Demo
  4 Like?

Easybox : lightbox clone for jQuery

July 25, 2012 | Drag & Drop, Media, Plugins, Windows & Overlay
Easybox : lightbox clone for jQuery

EasyBox is a lightbox clone based on the light-weight Slimbox2 script. It offers a variety of additional features such as:

  • displaying YouTube and Vimeo videos,
  • displaying inline content,
  • displaying iFrames and
  • better animations
Read More Demo
  1 Like?

Create CSS 3D Transform Card Flip Gallery with jQuery

July 23, 2012 | CSS2 / CSS3.0, Gallery
Create CSS 3D Transform Card Flip Gallery with jQuery

In this tutorial, we are going to apply card flip effect to a set of thumbnail gallery. We just want to demonstrate one of the simple way to use it. One thing though, CSS 3D transform is not a mature standard yet and only modern browsers are supporting it. As a result, to make this demo usable, we will make it degrade gracefully and replace it with scroll up effect.

Read More Demo
  2 Like?

PullOuts : jQuery Slide-out Widgets

July 23, 2012 | Animation, Plugins, Premium, Windows & Overlay
PullOuts : jQuery Slide-out Widgets

PullOuts is a stand-alone script based on a popular WordPress plugin – “PullOut Widgets”, and can be used on any website that supports HTML and JavaScript.PullOuts allows to grab any piece of content from a web page and display it as a pullout widget. Whether it’s a block of text, images, shopping cart, login, search or subscription form, a video or any other content – you can make it a pullout.

Features :

  • Flexible pullout widget positioning on top, right, bottom or left side.
  • Multiple pullout triggers:
    • on mouse click;
    • on mouse hover;
    • timer countdown;
    • page count;
    • when specified element appears on the screen.
  • Unlimited widget colors.
  • 289 slick icons for pullout tabs.
  • 32 sliding animation effects.
  • Multiple styles for pullout tabs: square, rounded corners, borders, combination of the above.
  • CSS3 vertical and horizontal tabs.
  • Pullout speed control.
Read More Demo
  1 Like?

Showcase Product Feature in 3D Style with jQuery & CSS3

July 23, 2012 | Animation, CSS2 / CSS3.0, Gallery
http://www.webstuffshare.com/2012/06/showcase-product-feature-in-3d-style/

Focus on showcasing our product features can be a good choice for attracting user on landing pages. By showcasing in 3D style also a good choice, in this tutorial I am going to share how to showcase our product feature in 3D style using CSS3 3D Transform and jQuery.

The showcase will be displaying product image and tagline. The tagline will be positioned in the middle of product image, so there will be product image in two positions, left and right of the tagline. These images will be rotated in 3D around y-axis with angle of rotation -35 degree for the left image and 35 degree value for the right, the image will be rotated.

Read More Demo
  1 Like?

Elegant Accordion with jQuery and CSS3

July 23, 2012 | CSS2 / CSS3.0, Gallery
Elegant Accordion with jQuery and CSS3

jQuery Elegant Accordion plugin has following features :

  • Auto-rotate through all the slides with extra options
    • Pause on hover
    • Stop rotation on click of a slide
    • Option to stop rotation at the end of the slides
  • Options for setting delay, animation speed and easing
  • Ability to set active slide onload using hashes (index.html#panel1-3)
  • Works with multiple instances on the page
  • Ability to specify width of active slide while automatically adjusting inactive slides
Read More Demo
  5 Like?

imJQMosaic : jQuery plugin creates Mosaic pattern using an image

July 22, 2012 | CSS2 / CSS3.0, HTML5, Image Effects, Plugins
imJQMosaic : jQuery plugin creates mosaic pattern using an image

imJQMosaic is a simple jQuery plugin that creates mosaic pattern using an image.

This is a pure JavaScript based jQuery plugin. Apart of just creating the mosaic pattern on an image, it also facilitates the user to put menus on top of the mosaic tile(s). Hence, it can be beautifully used as navigation menu. It can also serve as a substitute to the popular Flash based navigations on the home pages of a website or application which unfortunately don’t work on mobile phones not supporting Flash content.

This plugin is based on the technique of CSS sprites and also uses some of the new features introduced in CSS3. The plugin requires latest browsers that support HTML5 and CSS3. In absence of adequate browser, the plugin gracefully degrades and still works! Ideal behavior of this plugin can be viewed in Safari 4 or Firefox 3.5. But it works with Chrome and IE 8 also.

Read More Demo
  1 Like?

« First...102030...9091929394...100110120...Last »