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

    FFForm : jQuery Contact Form Plugin with Validations & Amazing CSS3 Animation

    September 12, 2013 | Ajax, Animation, CSS2 / CSS3.0, Forms, Plugins
    FFForm : jQuery Contact Form Plugin with Validations & Amazing CSS3 Animation

    The ‘Contact’ form on your website is like your door to rest of the world in the cyberspace. It is the easiest way for website visitors to drop a line and start the conversation.FFForm is a simple jQuery plugin that can be integrated in any website layout to provide a fully functional contact form. Built with jQuery and CSS, FFForm is compatible with all modern web browsers and mobile devices. It also provides various customization options including animations, field validation and notifications.

    Features:

    • AJAX Enabled
    • Cross-Browser Compatible
    • Data Validation
    • Custom handlers for events like onValidation, onSuccess and onError etc.
    • Various Animation Styles
    Read More Demo

    Glide.js : Responsive and touch-friendly jQuery slider

    September 11, 2013 | CSS2 / CSS3.0, Plugins, Responsive, Slider
    Glide.js : Responsive and touch-friendly jQuery slider

    Glide is responsive and touch-friendly jQuery slider. Based on CSS3 transitions with fallback to older broswers. It’s simple, lightweight and fast. Designed to slide, no less, no more.

    Read More Demo

    Sliding Horizontal Layout with CSS3

    September 11, 2013 | Core Java Script, CSS2 / CSS3.0, Slider
    Sliding Horizontal Layout with CSS3

    Today we’d like to share an interesting layout with you. You might have seen it already on Skybox or on the website of Lotta Nieminen. It’s a layout where we see the main section in the middle and part of the previous and next section on the sides. The navigation reflects this view by showing the three items currently visible. When clicking on one of the sides or on one of the lateral navigation items, the sections will slide to the respective side, showing the next or previous section. The same happens to the navigation.

    We use CSS 3D Transforms for moving the lateral sections. In a browser that does not support 3D Transforms (or where JavaScript is not enabled),

    Read More Demo

    Salvattore : jQuery Masonry alternative

    September 4, 2013 | CSS2 / CSS3.0, Plugins, Web
    Salvattore : jQuery Masonry alternative

    Salvattore is a  jQuery masonry alternative with CSS-driven configuration.Salvattore organizes your HTML elements according to the number of columns you specify. Each of the items in your container is placed within these columns, one by one.

    Read More Demo

    Accordion Pro JS : Responsive jQuery Accordion

    September 4, 2013 | Accordion, CSS2 / CSS3.0, Plugins, Premium, Responsive
    Accordion Pro JS : Responsive jQuery Accordion

    Accordion Pro JS is a responsive jQuery accordion plugin. Create horizontal and vertical accordions with a variety of attractive themes and customisation options.

    Features:

    • Fully responsive;
    • 5 unique themes (that’s themes, not colour options);
    • Create horizontal and vertical accordions;
    • Click or mouseover activation on desktop;
    • Touch or swipe activation on mobile devices;
    • Autoplay animation, easing and speed options;
    • CSS3 animations for smooth, hardware-accelerated animation on mobile devices and modern browsers; jQuery fallback for older browsers;
    • Right To left (RTL) support;
    Read More Demo

    Zig Zag Dropdown menu concept with CSS3

    September 1, 2013 | CSS2 / CSS3.0, Menus
    Zig Zag Dropdown menu concept with CSS3

    I found this two years old Dribbble shot by Ignacio Giri. Don’t ask me how, I just don’t remember how did I stumble upon it but one thing is clear: I bookmarked this dropdown menu concept, stared at it a bit and then I thought about making something similar with CSS.

    Read More Demo

    SKDZoom : jQuery Stylish CSS3 Image Zoomer

    August 30, 2013 | CSS2 / CSS3.0, Plugins, Zoom
    SKDZoom : jQuery Stylish CSS3 Image Zoomer

    SKDZoom – A jquery stylish CSS3 image zoomer plugin with lens zoom support. Big image shows in a awesome rounded box beside the thumbnail. It is very light weight and easily customizable image zoomer.

    Read More Demo

    Transitions for Off-Canvas Navigations with CSS3 & JavaScript

    August 29, 2013 | Core Java Script, CSS2 / CSS3.0, Menus
    Transitions for Off-Canvas Navigations with CSS3 & JavaScript

    Today we’d like to share another set of transition effects with you. This time we’ll explore transitions for sidebars or off-canvas content like the one we’ve used in the Multi-Level Push Menu. The idea is to show some hidden sidebar with a subtle transition on the element itself and also on the remaining content. Usually the sidebar slides in, pushing the other content to the side. But there are many more possibilities for subtle and fancy effects and today we want to give you some inspiration.

    Read More Demo

    NACHO Lightbox : Flat responsive lightbox with jQuery

    August 28, 2013 | CSS2 / CSS3.0, HTML5, Plugins, Popup Window, Premium, Responsive, Slider
    NACHO Lightbox : Flat responsive lightbox with jQuery

    NACHO Lightbox is the perfect plugin for showcasing images, videos, iframes and even ajax in a modern and usable manner that is available on every device.

    Features:

    • Flat skin – perfect for modern websites
    • Responsive and beyond – very adaptable, perfect for desktop, tablet and even mobile. It hides the thumbnails on small screens to keep the media visible.
    • Touch gestures – mouse and touch are unified, so you can do anything using either one.
    • Blazing fast – Featuring some of the coolest CSS3 Effects out there, it takes advantage of the GPU on mobile devices.
    • Responsive Videos from Youtube and Vimeo.
    • Responsive fluid grid included to keep your images aligned.
    • Powerful events API – you can control all the options through this easy to use API. 
    • Retina Graphics – Sharper on every screen
    • Deep linking – So when someone shares your image will be taken directly to that image.
    • No coding required – Using only jQuery selectors and HTML5 data attributtes
    Read More Demo

    3D Shading with Box-shadows in CSS3

    August 28, 2013 | CSS2 / CSS3.0
    3D Shading with Box-shadows in CSS3

    When working with 3D transformed elements, you might notice that they don’t have any shading and appear to be very flat. In real life, objects block light and have shadows. Surfaces can be matte, reflective, and everything in between. Indeed, we can do better.

    If you need to cast light onto complicated geometry, there are options available such as Photon, but they’re very processor intensive. In this article, I’ll show you a solution that can be applied to objects that only have a few faces. Our example will be a 3D movie gallery with glossy posters and, when the posters are rotated, the sides will contain matte information cards with meta data about the film.

    Read More Demo