In a recent tutorial I taught you how to create simple transparent tooltips with a few lines of CSS and jQuery. Today we will build some more advanced tooltips, based on the aforementioned tutorial.
CSS tooltips are very popular in modern web design and contrary to popular belief it is really easy to create them, especially with one of the all so popular javascript frameworks.
Before I started to delve deeper into this topic, I thought you have to use at least a plugin, but to get some basic tooltips all you need are about 10 lines of CSS and jQuery Code.
This Tutorial will teach you how to create such tooltips with some basic CSS and jQuery. – Read more –
Since the article Navigation Menus: Trends and Examples was released on Smashing Magazine in February, I got quite a number of mails from fellow designers, who asked how to accomplish the sliding effect of my main menu. Even enough mails, that I thought about writing a little tutorial, but I must admit I am to lazy at the moment =)
Anyways, here are some tips for creating a similar menu: Head over to http://mootools.net and get a little familiar with this extraordinary Javascript Framework. In the demo section of the page, you will find a sub-menu entry called Fx-Elements which contains everything you need to build a so called “kwick menu”. By analyzing the HTML, CSS and Javascript you should be able to accomplish similar menus in almost no time.
Those who use Jquery (which is my prefered Framework atm, because of the steeper learning curve) can use the plugin, recently written by Jeremy Martin at jMars blog. I haven’t tested it for now but looking at the preview examples, it seems to work pretty well.
Hope I could help those of you who seek aid in creating a similar menu.
Update: I am using jQuery now, as well as jMars Kwicks plugin and it works like a charm ;)
