Best jQuery CSS2 / CSS3.0 Plugins & Tutorials with Demo

    Showbiz Pro Responsive Teaser jQuery Plugin

    Showbiz Pro Responsive Teaser jQuery Plugin

    Showbiz Pro is a highly customizable plugin to show you or your customer’s services, portfolio items, blog contents… basically all business information thinkable.

    What makes this item unique is that you can define everything(Captions, Preview, Details etc.) via CSS or HTML or jQuery plugin option which gives you Unlimited Layout Possibilites. Please check out the examples to see for example how a small preview view expands to a rich detailed panoramic view. All fits nicely in the designated area.

    Features:

    • Fully Responsive & Mobile Optimized (Smartphones & Tablets)
    • Drag & Scroll Function
    • Smart Loading of Embeded Videos (YouTube and Vimeo)
    • Retina Ready Icons via Font Face Icons
    • Unlimited Slides
    • iPhone & Android Swipe Touch enabled
    • FullWidth and Single Width Reveals
    • Fast CSS3 & jQuery Engine
    • Fancybox 2 Lightbox Plugin on Multi Domain License included ($89 Value)

    Custom CSS3 Video Players With HTML5 and jQuery

    Custom CSS3 Video Players With HTML5 and jQuery

    In today’s multimedia web it’s becoming an ever increasing part of web design to include videos. Customizing the video player is one of the first things web designers think about when implementing these elements, as often the default player does not match the website, or merely for consistency across browsers and devices. In this tutorial we’re going to be going through exactly how to do that.

    jQuery Horizontal Drop-Down Menu inspired by the Microsoft.com

    jQuery Horizontal Drop-Down Menu inspired by the Microsoft.com

    A responsive horizontal drop-down menu inspired by the Microsoft.com menu.This large horizontal drop-down menu simply shows the sub-menu when an item gets clicked. It’s inspired by the Microsoft.com drop-down menu. Some example media queries show how to adjust the menu for smaller screens.

    jquery.transformlist : CSS3 transform styles and animations for jQuery

    jquery.transformlist : CSS3 transform styles and animations for jQuery

    jquery.transformlist is a Javascript plugin for jQuery to add support for styling and correctly animating CSS3 transforms that make use of multiple transform functions.

    jquery.transformlist is not intended to provide animation between arbitrary transform styles – it doesn’t provide the matrix decomposition required for that task. Instead it aims to assist you in creating a transform list of several transform functions that are composited for a specific task, and then provides you with means to use jQuery.animate() between different sets of arguments for those transform functions.

    That’s a little unclear, so imagine you set up a “camera” transform list allowing you to adjust the X, Y, and Z of the focal point; and then the rotation around, elevation above or below, and distance from the focal point.

    Anima.js : CSS animations with a soul

    Anima.js : CSS animations with a soul

    With Anima it’s easy to animate over a hundred objects at a time.Anima gives you the ability to use delays and durations normally, even for pure CSS animations. It has two modes: JS and CSS. The first one doesn’t really use CSS transitions or @keyframes. On the contrary, it uses CSS transforms and 3d-transforms together with Javascript to create animation. You have full control over the flow, so you can start, stop, cancel animations and even create event-based stuff. CSS mode allows you to generate pure CSS animations, but it has limitations for parallel animations.

    Clean Tabs: jQuery Responsive Tabs to Accordion

    Clean Tabs: jQuery Responsive Tabs to Accordion

    Clean tabs is a CSS3 and jQuery responsive navigation tabs, optimized for mobile & touch devices. On small screen, the horizontal tabs turns into a vertical accordion. More than 20 clean, smooth and elegant themes realized to work on every devices. Watch the preview images!

    Features:

    • CSS3 & jQuery.
    • More than 20 themes ready to use.
    • 5 pages already designed: Dashboard, Gallery, To-Do, Skills, Team
    • Easy to customize.
    • Clean & modern look.
    • Responsive and easy to use.
    • Works on mobile devices.
    • Cross-browser compatibility.

    BluePrint : jQuery Elastic Content Slider

    BluePrint : jQuery Elastic Content Slider

    Blueprint is a simple jQuery content slider. It has a sliding area for content and a tab-like navigation at the bottom. The slider is fluid, meaning that it will adjust to the parent’s container width and height. A couple of media queries show how to minimalise the look by just leaving icons for the navigation when the screen is very small. The content area will become scrollable if there isn’t enough space available. Every list item is a slide and and it has a corresponding link element in the navigation.

    jQuery Full Width Image Slider with CSS3

    jQuery Full Width Image Slider with CSS3

    This slider has a 100% width layout and it is responsive. It operates with CSS transitions and the image is wrapped with an anchor. The anchor can be replaced by a division if no linking is needed. With a max-width set to 100%, the image will size down for smaller screens.

    MediaTable : jQuery Responsive Table Plugin

    MediaTable : jQuery Responsive Table Plugin

    MediaTable listen to screen size to define visible or hidden columns using CSS media query.You can choose what column to view with the automagically columns menu. This is a usefull solution to display big data table into small screen devices allowing the user to display relevant data at the beginning then to choose what data to display.