This is a collection of the best tutorials for web designers Lupetti found this month browsing some websites. It also includes some of his posts 🙂 Take a look!
1. Most used CSS Tricks
A nice compilation of the most used CSS tricks in web design (rounded corners without images, style your order list, tableless forms, double blockquote, gradient text effect, vertical centering with line-height and more…)
2. Simple, Powerful Product Highlighter with MooTools
3. Timeframe: Prototype date range component
Stephen Celis got tired of wiring together two date pickers for the common use case of grabbing a date range, so he created timeframe, which is “Click-draggable. Range-makeable. A better calendar.”
4. Rating Boxes with Starbox
5. Navigation bar with tabs using CSS and sliding doors effect
This tutorial illustrates how to design a navigation bar with tabs using CSS and status effects (active, hover, link).
6. Create beautiful tooltips with ease
7. Solving 5 Common CSS Headaches
CSS is a relatively simple language to learn. Mastering it, on the other, can prove a little more difficult. Compensating for various browser inconsistencies alone can produce a migraine. In this article, we’ll demystify five of the most head thumping issues that you’ll encounter when building web applications.
8. Lazily load functionality via Unobtrusive Scripts
9. Nice calendar with date-pickers
10. Fantastic News Ticker Newsvine-like using Mootools
This tutorial explains how to implement a “News” Ticker, with vertical scrolling, using mootools. It’s very simple and quick to implement in your web projects.
11. Ajax Forms with jQuery
Travor Davis illustrates how easy it is to turn a regular form into a AJAX form.
A simple animated sidebar using mootools ready to use in your web projects.
13. Pure CSS Animated Progress Bar
Here’s a simple demonstration of how you can create animated progress bar using pure css. The trick is very simple. We need 3 elements, one container and 2 nested elements.
In Web applications I’ve seen numerous, and personally implemented a few, ways to rearrange items in a list. All of those were indirect interactions typically involving something like up/down arrows next to each item. The most heinous require server roundtrips for each modification…boo.
15. PHP components: Autosuggest
I published this simple “PHP component”, ready to use, to implement a search form with an autosuggest feature using PHP and MySQL. For all ajax beginners this is the most simple way to implement it (just with 8Kb) and the only thing you have to do is modify some parameters. Take a look at this post for all related infos.
16. Slick Tabbed Content Area using CSS & jQuery
This tutorial illustrates how to upload multiple file with one ore several file inputs using jQuery.
18. Add grunge effect to text using simple CSS
In this short tutorial you will see how to add grunge effect to your text using just CSS and one image
19. Creating a fading header
20. Accessible unobtrusive content scroller
This tutorial explains how to implement an unobtrusive content scroller.
21. How to Display Your RSS Count in a Cool Tooltip
How to display the current subscriber count using a combination of an extremely simple jQuery script and a PHP snippet.
22. Ext Accordion Widget Example
23. LightboxXL -prototype plugin
Lightbox functionality that you’re used to with embed Flash movies using prototype.
24. Change form elements appearance using FancyForm
FancyForm is a powerful checkbox replacement script used to provide the ultimate flexibility in changing the appearance and function of HTML form elements. It’s accessible, easy to use and degrades gracefully on all older, non-supporting browsers.
25. FORM elements design using CSS and list (ul and dl)
This tutorial explains how to design a pure CSS FORM using lists <ul>.
Thanks Antonio Lupetti