Responsive menu issues with Genesis Sample Theme

[lilifrancklyn]

Hi,
Maybe this is the wrong assumption but I had thought the Genesis Sample Theme (which doesn't seem to appear at all in the theme filter list so there's no clue as to its characteristics?) had the same characteristics as the Framework, which is to say HMTL 5 and Responsive.
But, we're having problems with drop-down menus not being responsive, particularly on Android. The problem is the :hover selector, which on a touch-screen device can't decide if it's a hover or click functionality. If it's a click, the screen jumps quickly to the parent item on the menu and doesn't allow the user to select things on the drop-down menu. I've seen lots of complicated workarounds for this and don't know what to try as an alternative.
If Genesis Sample is Responsive, then why does it use the :hover selector? What is the easiest way to configure the menus to work on mobile devices? My client's old HTML site using JS is more responsive than Genesis Sample!

Many thanks for any help (tearing my hair out),

Crucible Communications

http://www.communitycycles.org/wp

[Marcy]

Android always caused me grief too. Duplicating the :hover lines with :focus helps somewhat on Androids with a long touch.
The Genesis Sample theme does not include the responsive menu.

1. Most of the Pro Genesis themes now use a mobile responsive menu that works like this one that Ozzy Rodriguez did:
(The js is a bit different though, but the function is pretty close.)
http://ozzyrodriguez.com/tutorials/genesis/genesis-responsive-menu-2-0/
Here is a demo
http://demo.ozzyrodriguez.com/responsive-menu/

2. Here is a tutorial by Sridhar Katakam using the Beautiful Pro menu.

How to add Beautiful Pro’s mobile responsive menu in other Genesis themes

I hope these help you get it going.

---

Marcy | Amethyst Website Design | Twitter

[Author]

Posts