Hello, I have a query about displaying a sublist on touch. I have created a sublist that is supposed to show up when you hover over it. You can view the demo here:
@import url(//fonts.googleapis.com/css?family=Titillium+Web:400,200,300,600,700);
body {
font-size: 18px;
line-height: 1.42857143;
color: #000;
background-color: #fff;
font-family: 'Titillium Web', sans-serif;
margin: 50px;
}
a {
color: #000;
text-decoration: none;
background-color: transparent;
}
.wrapper {
display: block;
position: relative;
float: left;
}
...
<div class="wrapper">
<a href="#">
TOUCH ME 1
</a>
<div class="subitems">
<a href="#">ITEM 1.1</a>
<a href="#">ITEM 1.2</a>
</div>
</div>
...
When I try to touch the buttons in Chrome/Firefox, the submenu appears. However, IE does not seem to show it for some reason. Can someone explain why and suggest a solution?
I have not used any jQuery code. I am relying on standard browser functionality. If adding jQuery code is necessary for it to work universally, I am open to that.
P.S. My focus is solely on touch events, not mouse clicks.