Advertise here

CSS3 & CSS

FlipClock.js – jQuery Plugin to Add Counter, Timer, Clock with Flip Effect

May 27, 2013     14500     CSS3 & CSS Date & Time Effects
FlipClock.js – jQuery Plugin to Add Counter, Timer, Clock with Flip Effect

FlipClock.js is a jQuery plugin with CSS3 animations to add counter, timer and clock with smooth flip effect.

Features

  • Use as a clock
  • Use as a timer
  • Use as a countdown
  • Themeable using pure CSS
  • Clean & Dry Syntax
  • Abstract everything into reusable objects
  • Full-Featured Developer API to create custom “Clock Faces”

Read More »

least.js – Responsive HTML5 and CSS3 Gallery with LazyLoad

May 20, 2013     12876     Responsive CSS3 & CSS Gallery HTML5
least.js – Responsive HTML5 and CSS3 Gallery with LazyLoad

least.js is a random & responsive HTML 5, CSS3 gallery with lazyLoad. Installation and usage is simple, and the end result is quite beautiful.

Read More »

Flip – Flipboard Like Effect for jQuery & jQuery Mobile

May 14, 2013     19720     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     5964     Responsive CSS3 & CSS
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     6179     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     2790     Responsive Mobile CSS3 & CSS
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     4493     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     6897     Effects CSS3 & CSS
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     8469     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     6361     Effects Form Elements CSS3 & CSS
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     2152     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     29265     Modal & Overlay CSS3 & CSS
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     9515     CSS3 & CSS Slider Gallery 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     9763     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     5550     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 »

AdvertisementAdvertise with us!