5 Cool CSS Hover Effects You Can Copy and Paste

Need a cool hover effect for something on your site? Look no further! We’ve created several custom examples that you can view live for inspiration. If you like the effect, steal it! Bring Your Boring Site to Life Hover effects can make your site feel much more dynamic and alive. The effects we’ll be using today all use code that is supported by modern browsers, meaning of course Mozilla and Webkit for the most part. Bump Up Live Demo: Click Here to Launch This works best when you have a series of horizontal items. This one is super easy to implement and there are in fact several ways to go about it. The transition here is completely optional as the effect still works quite well without it. Bump Up CSS Stack & Grow Live Demo: Click Here to Launch For this one I wanted a sort of lava lamp effect so that as you move your mouse down the list, each image slowly expands and then goes back to its original size. To accomplish this, I inserted a stack of images that were 400px wide by 133px tall.

How To Create The Google Circles Effect With CSS & jQuery This week’s Tutorial of the Week teaches you how to create a circle just like the one Google Circles use. As many of you might have already seen, one of the coolest features from Google’s new social project is the way you can easily add users to different circles to keep your social connections more organized. This tutorial will only cover how to create the actual circle and have it grow when your mouse goes over it. You will not learn how to do the little profile images that appear around the circle, though if there is enough demand for me, I can work on that in the near future. First off, this is what our circle should look like: Step 1: Requirements For this to work, you will need to include the jQuery library. Step 2: Create the HTML For this example, we will only be creating one circle. The <strong>circle</strong> div will contain all the elements. Step 3: The CSS You will need quite a bit of CSS for this one. The properties above will position the circle. Step 4: The jQuery code

How to Make an HTML5 iPhone App By Alex Kessinger You’ve been depressed for like a year now, I know. All the hardcore Objective-C developers have been having a hay-day writing apps for the iPhone. I don’t want to say that you should give up on the objective: you can get it eventually. You can create a native app that lives with all the other apps, and for the most part, it’s going to be a pitch-perfect imitation. You can do this with the skill set you probably already have: HTML(5), CSS, and JavaScript. I’ll show you how to create an offline HTML5 iPhone application. Offline? What am I talking about when I say "offline"? The app should be as functional as it can when it is offline, just like normal native mobile apps. This is a tutorial specifically for iPhones but most of these techniques apply to all phones that have HTML5-capable browsers. Yeah, I mean it, check out the following image. Prework You are going to need access to a server where you can change the HTTP Headers on your files. About the App Application Cache <!

jQuery Forms Plugins to Improve Form Usability Forms are essential for communication online and they are the single most important interface to collect information from users. Why not spice you forms up a bit and make your site more appealing and user friendly? This post will help you get an idea of what what is possible to achieve with a few lines of simple jQuery code ans the right jQuery forms plugins. Advertisement Skinning and improving look and feel of HTML forms with jQuery forms plugins jqTransform This plugin is a jQuery styling plugin wich allows you to skin form elements. Checkbox and Radio Input Replacement This combination of JavaScript and CSS will hide checkbox and radio inputs that have a class = “crirHiddenJS”, an id, and a proper label tag. This will allow you to style the label however you wish using CSS, and the actual input control will be hidden. Custom Checkbox with jQuery This script provides you with the ability to customize the design of checkboxes in your web forms. jQuery Checkbox Pretty Checkboxes with jQuery

RhoMobile Suite You can either spend a tremendous amount of time and money creating and managing different versions of each application — or you can get Motorola Solutions' RhoMobile Suite, a powerful set of development tools that help businesses mobilize their workers, no matter what technology is in their hands. With RhoMobile Suite, comprised of RhoElements, Rhodes, RhoConnect, RhoStudio, RhoHub and RhoGallery, device type, operating system and screen size don't matter. RhoMobile Suite applications simply work on whatever mobile devices are in use and you have complete control over how applications behave on different devices. RhoMobile applications are OS-agnostic, able to support enterprise- and consumer-class operating systems so you can write, integrate, deploy and manage applications that work across platforms, from iOS and Android to Windows Mobile and systems that don't even exist yet, on both consumer and enterprise devices.