I needed to add Dropdown menus to a site that a designed using Drupal. I found a few modules (Nice Menus, etc) that would enable me to easily add dropdown menus to my site, but I wanted to use the CSS Drop-Down Menu Framework that I discussed in a previous post. With a little help from JQuery, I was able to add dropdown menus to my site without having to use a Drupal module.
I created a YUI widget that is based on my imAnimTabber JQuery Plugin. The imSliderMenu displays content by animating the height or the width of the contents container. I use the imSliderMenu widget on my marketing site, http://1st-steps-to-success.com. The slider menu is handy in that I am able hide content on a page until it is needed and still maintain the look and feel of my website design. As with the imAnimTabber JQuery plugin, The imSliderMenu dynamically creates the menu items based on CSS and a few lines of code.
I decided to redesign my company site (intriguingminds.com). I hadn’t touched it in about 3-4 years, so it was long overdue. With its simplistic design, I decided to use the imUpSideDownTabber JQuery plugin that I had created a few months ago. I soon learned that, due to my design, the plugin was not robust enough for the functionality that was necessary, so I decided to create an upgrade. The new functionality was significant enough (it does more than just up-side-down-tabbing) that I decided to rename the plugin altogether (imAnimTabber). I never did like the name ‘imUpSideDownTabber’. The imAnimTabber plugin can be used to display content with the following animated options:
As with the imUpSideDownTabber, the tabs can be created dynamically (‘auto’ mode), but I added a ‘manual’ mode so that the plugin can function when the tabbing interface is already created (the ‘carousel’ option can only be used in ‘manual’ mode). One of the major changes in this JQuery plugin is that the tabs can be individually styled. I needed this functionality for my IntriguingMinds.com (link) site. Unlike the imUpSideDownTabber, I created a demo page so that you can see how to set it up.
After many years of creating Flash-enabled websites (and writing a lot of ActionScript), I decided to explore the use of Ajax. I had grown so accustom to developing websites where page refreshes weren’t required that I rarely created websites using HTML only. From everything that I read prior creating website using Ajax, I thought that it had the promise to replace Flash. My primary reason for exploring the use of Ajax to create websites was because, as I learned more about marketing a website (and how most search engines don’t/can’t index Flash-only sites), I decided that it was better to appear in a search engine’s listing than to have cool navigation (and animation!).