Web designer and developer Mary Lou shows us how to create a simple blur effect for text-based items using jQuery and CSS3. What this plugin does is it blurs and scales down texts boxes that are hovered over, while scaling up the item in focus, drawing attention to it. Click on the image to know [...]
Ever noticed how shopping sites can filter out certain items according to the visitor’s preferences? Here’s a quick and very helpful tutorial that will teach you how to do something similar to that without any need for database calls or page refreshes. Let’s begin with the CSS structure to make the layout presentable. /* SIMPLE [...]
What’s great about sequence.js is that unlike most other slider plugins, it presents unlimited customization options, which is why designer Ian Lunn touts it as ‘the jQuery slider plugin with infinite style’. Rotate, fade, skew, 3D transform, parallax effects, you name it, you got it! It’s also responsive, supports touch devices, non-JS fallbacks, and it [...]
The Power PWChecker is a free jQuery plugin that helps your website users come up with a more secure password. It can be integrated with any form on your website. Click on the image above to view the demo. What the Power PWChecker does is it observes the password and checks its strength so the [...]
The web developers at Maui Website Design have designed a dynamic image menu that allows you to navigate easily through any visual content with a Motools-inspired effect, powered by jQuery Javascript. The menu’s main functions require a jQuery-compatible script, a valid XHTML, a Motools-like sliding effect, and it should be lightweight. It comes in two [...]
If you’re conducting an online business, this jQuery plugin called Smart Validate will be a helpful addition to your website. Created by the egrappler.com web developers, it makes credit card validation easier and more convenient. The following credit cards are supported by Smart Validate: - Visa Card - Master Card - Discover - American Express [...]
I’ve come across this neat tutorial on how to create nice-looking linked tooltips using CSS3 and a little bit of jQuery for that cool fade in/out effect. Below is a screenshot of what the tooltips in the tutorial look like: There are 3 variations of the balloons’ arrows, wherein they can point left, center, or [...]
Mary Lou of Tympanus.net shows us a fun way to add a background image to a text element by experimenting with the CSS property “background-clip: text”. We can create very beautiful effects with the addition of these CSS3 transitions. Take note that the property ‘background-clip: text’ is supported in Webkit browsers only. Check out the [...]
Ivan Vanderbyl‘s cool CSS progress bar actually shows you a percentage of how much longer the process takes, unlike the others that just leave you guessing. Click on the screenshot above to see the code in action. HTML Markup <!DOCTYPE html> <html> <head> <meta charset=”utf-8″> <title>Pure CSS Progress Bar</title> <link rel=”stylesheet” href=”stylesheets/ui.css”> <link rel=”stylesheet” [...]
The tag cloud lets the visitors see the available site topics, additional info, and it can also be used to link blog posts, images, videos, etc. in your site. It’s so popular that several tag cloud versions have been created by many web developers and designers, and one of them is Dan Wellman who has [...]
0
465
