26 Best Ways to Implement AJAX, CSS and Javascript-based Tabs
Nowadays, it is common to see tabs for menu and selection in any web site. Tabs is useful when you want to present different categories in neat way.
This is a compilation of 26 best collections of CSS-based tab using AJAX and non-AJAX.
Edit CSS Live in FireFox and IE
Do you know you can edit your CSS code live in both FireFox and IE?
Meet CSSVista, a free Windows applications that lets you edit your CSS code live in FireFox and Internet Explorer. Using CSSVista, you can test your web application without switching browsers
Download CSSVista version 0.15 for Windows XP/Vista here.
Supernote Popup Tooltips
Supernote is a pop up tooltip library based on CSS and Javascript. Some of the features include:
- Pure CSS formatting
- Nested tooltip in unlimited level - the tooltip can contain another tooltip
- Accessible HTML elements used to construct the tooltip - maintains excellent search engine
- The tooltip can be activated by hover or clicking the link
The library is free to use, however, you are required to include credit link to author’s web site. Alternatively, you can donate to support the library if you want to use in your web site without a credit link.
Stylish File Input with CSS
File input (<input type=”file”/>) is always a challenge because of its ugly and non-consistency look in different browsers and different OS.
Shaun Inman, the creator of Mint, has come out with a stylish file input library using CSS and Javascript. The library works in IE 5.5+, Firefox 1.5+, and Safari 2+.
Click here for the demo.
Note: Unfortunately the script on demo page doesn’t seem to work in Firefox 2.0.0.6 under Ubuntu.
Fancy Menu
Guillermo Rauch has come out with combination of CSS and Javascript to create fancy menu with a nice effect. Move the mouse over the menu link and have the element served as background animated following the mouse over.
The Fancy Menu needs Mootools library and it is cross-browser (tested on Internet Explorer 6/7, Firefox and Safari).
Download Fancy Menu here.
CSS Blueprint
How many times you need to reinvent the wheel because when you create new a web site, you code again and again the same basic CSS? Using a blueprint can help you to reduce your development or design time.
CSS Blueprint is a new-kid-on-the-block in CSS framework, which is distributed under a modified MIT license. It is developed by Olav Bjørkø and gives you basic grid layout, typography, print stylesheet, and more.
You can click here for view a demo page developed using CSS Blueprint.
Of course it cannot be compared with more mature framework. In Web 2.0, you need to build a complete features-rich and interactive web application that can attract your site visitors to come. You might want to turn your head to The Yahoo! User Interface Library (YUI), the more complete framework developed by Yahoo. Besides CSS framework, it has set of controls built using DOM scripting, DHTML, and AJAX.
Nevertheless, CSS Blueprint looks like a nice framework. I will give it a try.
