I’ve been working diligently on an upgrade of the Macross Hotel landing page. I currently have a rough sketch of a drop down menu and I’ve used the same method to create six different drop down content sections throughout the page. The page so far looks 100% better than the old boring and plain one here.
When I uploaded the new hotel page and tested it on my iPhone I noticed none of the drop downs were working. I’ve been working on this page for going on two days now I freaked out thinking that there was a potential that all my work was in vain!
Before I lost my cool and all my cool points I looked the issue up online. During my research I came across a Stack Overflow post where I learned I wasn’t the only one who had come across this problem. As it turns out it seems iOS devices don’t handle the ‘hover’ tag like browsers do. As a remedy the posters on Stack Overflow recommended the use of either:
- onclick=”void(0)”
- onclick=”return false”
- onclick=””
- onclick=”return true”
This would go in your HTML like this:
<div class=”menu-title” onclick=”return true”>TITLE</div>
I’m still a newbie, I’m not going to pretend understand how or why this works. I know it appears this code is JavaScript, but I can’t say for sure. Hopefully in time I’ll be able become fluent enough in JavaScript to understand the function of this, but for now I’ll continue to stay on my current course of trying to ‘master’ CSS.