Archive for the ‘Web Site How-to’s’ Category

Converting JavaScript mouse-over event to click for iPod, iPad, and smart phones

Thursday, February 28th, 2013

If you are like me you might have a website using JavaScript to read a mouse-over event, like a menu item. The drop-down menu works great for PC web browsers, but not with Safari on iPods, iPads, and other smart phones. The reason is the before mentioned devices do not have a mouse and by touching the screen the event is now a click instead of a mouse-over.

Here is something to try to prevent having to re-write all those lines of JavaScript to include a click event, add a click event tag. This is not too hard if you understand HTML.

  1. Find the top level object’s name, like Products.
  2. Use an anchor tag around the top level, drop-down menu word.
  3. The anchor tag will be linked to a null item.
  4. Close the anchor tag after the top level, drop-down menu word.
  5. Save the file.

Example:

Top level menu item <javascript>Products </javascript>

Add the anchor tag <javascript><a href=”./”>Products</a></javascript>

Reload the web page and give it a go on an iPod or iPad. Users will be able to click on the Products menu item and receive the drop down list.

Enjoy!