Posts

Move text when mouse over in Css3

Image
Move text when mouse over <style type="text/css"> .mbt-nudge { -moz-transition: all 0.4s ease-out 0s; -webkit-transition: all 0.4s ease-out 0s; } .mbt-nudge:hover { margin-left: 55px; padding-left: 5px; } </style>

Opacity effect With Image Rotation

Image
<style type="text/css"> img.opacity { -moz-transform: rotate(5deg); -moz-transition: all 0.5s ease-out 0s; -webkit-transform: rotate(5deg); -webkit-transition: all 0.5s ease-out 0s; margin-left: 50px; opacity: 0.5; } img.opacity:hover { opacity: 1; margin-left: 0px; -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-box-shadow: 1px 1px 4px #000; -webkit-box-shadow: 1px 1px 4px #000; box-shadow: 1px 1px 4px #000; } </style>

Rotate css3

Image
Cascading Style Sheets (CSS) is the language of Web design, and the next generation of CSS design properties are just chomping at the bit to be released. Today i show you how to rotate text in Css3 <div class="current-date"> <span class="day">31</span> <span class="month">July</span> <span class="year">2009</span> </div> <style type="text/css"> .cureent-date { background-color: red; float: right; margin-left: 10px; padding: 45px 5px 0; position: relative; } .current-date .day { font-size: 45px; left: 5px; line-height: 45px; position: absolute; top: 0; } .current-date .month { font-size: 25px; text-transform: uppercase; } .current-date .year { -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); display: block; position: absolute; right: -5px; top: 15px; ...

Designing with html5 css3

Image
HTML5 is the next major version of HTML. HTML5 provides some great new features for web designers who love to create readable code and semantically-meaningful layouts. HTML 5 introduces and enhances a wide range of features including: form controls, APIs, dragging and dropping, multimedia, drawing graphics on screen and a lot more. - SlimKiwi - Antilight - EnergyCell - Giovannitufo

NimbleKit

Image
NimbleKit is the fastest way to create applications for iOS. You don’t need to know Objective-C or the iOS SDK. All you need is to know how to write an HTML page with Javascript code. Without any complicated configuration, NimbleKit easily installs in Xcode and provides you with a new “NimbleKit Project Template”. Choose this template, select whether you want to build for iPhone/iPod, iPad or a universal app, then add your Html, Javascript & Images to your project. Click “Build and Run”, and your application instantly launches in the iPhone/iPad simulator.

jQuery Mobile

Image
jQuery Mobile is Touch-Optimized Web Framework for Smartphones & Tablets. It is a unified user interface system across all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI foundation. Its lightweight code is built with progressive enhancement, and has a flexible, easily themeable design. jQuery mobile framework takes the “write less, do more” mantra to the next level: Instead of writing unique apps for each mobile device or OS, the jQuery mobile framework will allow you to design a single highly branded and customized web application that will work on all popular smartphone and tablet platforms.

Free High Quality Mobile Icons in PNG format

Image
You can use these icons on your mobile applications or mobiles. Mobile Icon Set includes Phone Call, Photos, Messages, Calculator, Wireless, Calendar, Settings, Contacts, Notes, Map. Usage: Free for Personal and Commercial Projects (Size: 128, 64, 48, 32px)