CSS

How to use currentColor

currentColor is a CSS variable-like feature that's been around for quite awhile now and has reasonably good browser support (it's supported by all modern browsers and their mobile counterparts, and even IE9+, though bugs have been reported in mobile Safari). While most variables are still being used with preprocessors until support becomes more widely established, currentColor can be used as-is. currentColor is super useful under some specific circumstances, and well worth learning (especially...
PHP

How to automatically process digital orders with PayPal

It's not trivial to set up PayPal IPN (Instant Payment Notification). It requires a free Business (Premium) PayPal account, a web hosting account with PHP support, configured to allow creating HTTP socket connections using "fsockopen" function, a MySQL database set up on your web server, a mailing mechanism (for sending the product to the buyer) and a free Gmail account. It may seem like a lot, but everything except the web hosting server (which you probably already have) is free, and once it is fully...

How to use the Device Orientation API

Today we have mobile devices that come equipped with everything from cameras to geolocation, and we have little computers in our hands that can do pretty much anything we do with our desktop. One of the key APIs that functions with mobile devices is the Device Orientation API. The Device Orientation API helps us as developers detect the orientation of the user's screen and make the necessary changes to our layout. For example, on YouTube, if you are watching a video and you tilt your phone, the video goes...

How to build Growl-style notifications with jQuery

Mac OSX is able to display message notifications — still referred to as Growl messages, despite the fact that the big cat moniker is no longer applied to versions. Many applications send Growl messages to the OS to let the user know that an action has just occurred. Wouldn’t it be nice to use messages like this on our websites? I think so. In this tutorial we’ll construct a notification like this with HTML, CSS3 and a little jQuery. Growl message functionality ... When more than one message is displayed,...

How to enhance HTML5 gaming with the Gamepad API

One of the big obstacles in designing a game in HTML5 is that the popular gamepad hardware isn't available. Nobody wants to play a game with keyboard buttons, so the arrival of the Gamepad API brings us a lot closer to console-style gaming in the browser. Browser support ... At the time of writing, the only browsers that support the Gamepad API are Chrome and Firefox — the latest version of each working unprefixed. However, the more we use this API, the more browser manufacturers will support it, and as...

How to edit text faster with Vim’s command mode

Stick around code nerds long enough, and we'll start talking about text editors. Eventually, one might (or, if you're discussing this on the Internet, one certainly will) bring up Vim. Ah, Vim: the text editor that many command-line users love. Here's what happened to me: I was looking into new software with which to write my articles and synchronize them to Evernote. Through a convoluted series of events which I shall not describe here, I ended up spending a couple of hours learning to use Vim. I'm...

How to use the Battery API

The more demanding our web apps become, the more power we draw from devices. On desktop, where we can be sure that the device is plugged into the mains, that's not a problem, but on a mobile device we need to know what the battery is doing and respond accordingly. Browser support ... At the time of writing the Battery API is only supported by Firefox (mobile and desktop). However, it doesn't require a vendor prefix to be supported. The reason I mention desktop is because this API can also be used with any laptop...

How to use jQuery selectors

Whether you're new to jQuery or have been using it for a while, the chances are you might not be making full use of the selector syntax. Rather than simply listing the possible selectors, in this tutorial we will work through a practical example in which we create an interactive page component, introducing the basics if you're a beginner. After that we will run through some of the other selector options you can choose from. Create a page ... Create a new HTML5 page: <!DOCTYPE html> <html> <head>...
Load more
Home CSS Deals DesignBombs HTML HTML5 JavaScript jQuery Miscellaneous Mobile MySQL News PHP Resources Security Snippet Tools Tutorial Web Development Web Services WordPress