Johns Hopkins asked Vim to help solve two pressing issues on their homepage. The first was solving global navigation usability issues and the second was replacing a Flash-based image gallery with JavaScript. Being the forward thinkers that they are, they asked us to use jQuery as their solution platform and we said "Great choice!"

Issue One: JavaScript Navigation

JHU's navigation was built with some older JavaScript and had a few usability issues. The navigation would stick and in some cases would fire on rollover when the user had no intent of interacting with it. It was also not 100% cross-browser compatible.

The Solution

Vim removed all inline JavaScript, rebuilt the HTML include that ran the static portion of the drop-down, and used jQuery to fire the hover effect. We also added a time that the user needed to hover over a navigation element before the drop-down would fire and a time that the menu would stay open before closing. We added the slight delay in opening and closing the menu for two reasons. First, to ensure that the user actual wants to interact with the navigation and, second, to give the user a extra time in case they hover off the element to hover back over before the menu closes. We all know how annoying it is when you try to get to a menu item, but lose it multiple times because you accidentally hover off the menu.

Issue Two: Flash Image Gallery

JHU was using a Flash gallery to display their homepage images and wanted a solution that was mobile-friendly, with less overhead, and maintained the same look and feel. jQuery to the rescue!

The Solution

Vim stepped in and built JHU a custom jQuery plugin to use as their image viewer with all the same features as the old Flash player. Keep your eyes open for this plugin on the jQuery website coming soon. We'll update everyone when it's released.