Advertise here

CSS3 & CSS

Flip – Flipboard Like Effect for jQuery & jQuery Mobile

May 14, 2013     19608     CSS3 & CSS Mobile Effects
Flip – Flipboard Like Effect for jQuery & jQuery Mobile

Flip is jQuery/jQuery mobile plugin to give Flipboard app like effect. Flip effect uses css 3d transform.

Flip effect currently works on WebKit browsers (e.g. Chrome, Safari, including iOS mobile safari) or Firefox 11. It still works with other browsers but the "slide" effect will be selected forecely.

Read More »

MixItUp – CSS3 and jQuery Filter & Sort Plugin

May 03, 2013     5851     CSS3 & CSS Responsive
MixItUp – CSS3 and jQuery Filter & Sort Plugin

MixItUp is a light-weight but powerful jQuery plugin that provides beautiful animated filtering and sorting of categorized and ordered content.

It plays nice with your existing HTML and CSS, making it a great choice for fluidresponsive layouts. It's perfect for portfolios, galleries, blogs, or any categorized or ordered content!

Read More »

Fullscreen Layout with Page Transitions

April 23, 2013     6064     CSS3 & CSS Responsive
Fullscreen Layout with Page Transitions

A simple responsive layout with some fancy page transitions. The idea is to show four items initially and expand them. Some additional page transitions are added for inner items.

All effects are done with CSS transitions and controled by applying classes with JavaScript. The whole layout is flexible and some media queries are added to size down things for smaller screens.

Read More »

Responsive Nav – Responsive Navigation Plugin with Touch Support

April 09, 2013     2770     CSS3 & CSS Mobile Responsive
Responsive Nav – Responsive Navigation Plugin with Touch Support

Responsive Nav is a tiny JavaScript plugin which helps you to create a toggled navigation for small screens.

It uses touch events and CSS3 transitions for the best possible performance. It also contains a “clever” workaround that makes it possible to transition from height: 0 to height: auto, which isn’t normally possible with CSS3 transitions.

Read More »

Panzoom – jQuery Plugin for Panning & Zooming Elements with CSS3

March 20, 2013     4458     CSS3 & CSS Zoom
Panzoom – jQuery Plugin for Panning & Zooming Elements with CSS3

Panzoom is a progressive plugin to create panning and zooming functionality for an element.

Rather than setting width and height on an image tag, Panzoom uses CSS transforms and matrix functions to take advantage of hardware/GPU acceleration in the browser, which means the element can beanything: an image, a video, an iframe, a canvas, text, whatever.

Read More »

oriDomi – Fold Up DOM Elements Like Paper

March 18, 2013     6821     CSS3 & CSS Effects
oriDomi – Fold Up DOM Elements Like Paper

oriDomi is a JavaScript library for folding up any HTML element just like a paper. Oridomi has jQuery support and only works in modern browsers that support CSS 3D transforms.

oriDomi has touch support and works on iOS.

There are multiple effects provided: accordion, reveal, curl, collapse, ramp, foldUp, unfold and reset.

Read More »

Create an Animated Bar Graph with CSS and jQuery

March 12, 2013     8390     CSS3 & CSS Chart & Graph
Create an Animated Bar Graph with CSS and jQuery

Nice tutorial from Smashing Magazine about "Creating an Animated bar Graph with CSS And jQuery". 

What this tutorial is making?

  • A progress bar that indicates how long until the end of all humanity in the event of a zombie plague;
  • A graph indicating the decline in safe outdoor activities during a zombie plague;
  • A frighteningly similar graph indicating the decline in manners during a zombie plague;
  • The increase of people who were unaware of the zombie plague because they were sharing with all of their now-deceased friends on Facebook what they did on FarmVille

Read More »

Fancy Input – CSS3 Text Typing Effects for Input Fields

March 08, 2013     6266     CSS3 & CSS Form Elements Effects
Fancy Input – CSS3 Text Typing Effects for Input Fields

Fancy Input is a jQuery plugin that makes typing & deleting in input / Textarea fields exciting with CSS3 effects.

  • Supports input (type text) and textarea form elements
  • Add effects to each letter being typed / deleted
  • All effects are highly customizable via CSS
  • Default effects are CSS3 hardware accelerated
  • Tries to simulates real input / textarea as much as possible

Read More »

jquery.transformlist – CSS3 Transform Styles and Animations for jQuery

March 07, 2013     2122     CSS3 & CSS Animation
jquery.transformlist – CSS3 Transform Styles and Animations for jQuery

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

jquery.transformlist 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.

Read More »

How to Create a jQuery Confirm Dialog Replacement

March 01, 2013     29161     CSS3 & CSS Modal & Overlay
How to Create a jQuery Confirm Dialog Replacement

In this tutorial you are going to build a cross-browser, custom confirm dialog in the form of an easy to use jQuery plugin. You can choose the text, buttons, and actions that will be executed when they are clicked.

Read More »

Full Width Image Slider

February 26, 2013     9398     Slider Gallery CSS3 & CSS Mobile
Full Width Image Slider

Full Width Image Slider is a very simple 100% width slider that scales down to mobile.

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.

Read More »

How to Create Windows-8-like 3D Animations with CSS3 and jQuery

February 25, 2013     9664     CSS3 & CSS
How to Create Windows-8-like 3D Animations with CSS3 and jQuery

Tutorial about "How to Create Windows-8-like 3D Animations with CSS3 and jQuery"

The demo works in the latest versions of all browsers, including IE10.

Read More »

Looper.js – Lightweight Carousel jQuery Plugin

February 08, 2013     5503     Slider CSS3 & CSS Carousel
Looper.js – Lightweight Carousel jQuery Plugin

Looper.js is an intuitive, lightweight carousel jQuery plugin.

Cycle through your content without writing a single line of Javascript. To keep things simple, transition effects are optional and have been limited to slide and cross-fade. In browsers that don't support CSS transitions, jQuery's animate is used.

Keyboard navigation is available when the element has focus. Simply use the left/right arrows keys.

Read More »

GFX – 3D CSS3 Animation Library for jQuery

February 04, 2013     5755     CSS3 & CSS Animation
GFX – 3D CSS3 Animation Library for jQuery

GFX is an 3D CSS3 animation library that extends jQuery with some useful functionality for programmatically creating CSS3 transitions.

CSS3 transitions are superior to manual ones (using setTimeout) since they're hardware accelerated, something particularly noticeable on mobile devices.

Read More »

Textillate.js – Simple jQuery Plugin for CSS3 Text Animations

January 30, 2013     10821     CSS3 & CSS Animation Text & String
Textillate.js – Simple jQuery Plugin for CSS3 Text Animations

Textillate.js combines some awesome libraries to provide a ease-to-use plugin for applying CSS3 animations to any text.

Read More »

AdvertisementAdvertise with us!