Tuesday, February 7, 2012

Adaptive Images with php and javascript

Adaptive Images detects your visitor's screen size and automatically creates, caches, and delivers device appropriate re-scaled versions of your web page's embeded HTML images. No mark-up changes needed. It is intended for use with Responsive Designs and to be combined with Fluid Image techniques.Features:

  • Works on your existing site

  • Requires no mark-up changes

  • Device agnostic

  • Mobile-first philosophy

  • Easy & powerful customisations

  • Up and running within minutes

CSS3 & jQuery folder tabs

In this article, I will use a technique in order to create some good looking CSS3 tabs.While in my previous CSS3 tabs tutorial I tried to simulate some beveled corners for the tabs, this time I will show you how to create folder tabs using nothing more than pure CSS3 and jQuery.

YMslider Content Slider jQuery Plugin

It is a simple dynamic, light-weight (2,2K minified, lighter GZipped) and non-intrusive content slider jQuery plugin, fully CSS customizable (theme support) with respect of accessibility and W3C standard rules (strict xHTML valid) ...

Monday, February 6, 2012

Scrolldeck : jQuery scrolling presentation decks plugin

Scrolldeck a jQuery plugin for making scrolling presentation deck.After linking all the required scripts (jQuery, Scrollorama, scrollTo, easing & scrolldeck), create the slide deck on document ready event.Add animations to slides by adding the "animate-in" or "animate-build" classes to elements in your slides.

turn.js - jQuery plugin Page Flip effect for HTML5

Turn js is a plugin for jQuery that adds a beautiful transition similar to real pages in a book or magazine for HTML5. Being inspired by the effect of iBooks and Maps for iOS, I created two classes: one for manipulating the overall publication and another for each individual page. The last one is completely independent, in that it offers an API for creating its own implementations.Having some features :

  •  Uses Hardware acceleration

  • Works on tablets and smartphones

  • Easy to manipulate

  • Lightweight, only 15K

3D Gallery with CSS3 and jQuery

Today, we want to share an experimental 3D gallery with you that uses CSS 3D transforms.With 3D transforms, we can make simple elements more interesting by setting them into three dimensional space. Together with CSS transitions, these elements can be moved in 3D space and create a realistic effect.

The main idea is to create a circular gallery where we have an image in the center and two on the sides. Since we are using perspective, the two lateral images will appear three dimensional when we rotate them.

Sunday, February 5, 2012

Produce Big, Bold & Responsive Headlines with jQuery SlabText

SlabText is a jQuery plugin for producing big, bold & responsive headlines . The script splits headlines into rows before resizing each row to fill the available horizontal space. The ideal number of characters to set on each row is calculated by dividing the available width by the CSS font-size – the script then uses this ideal character count to split the headline into word combinations that are displayed as separate rows of text.