所以,我目前正在尝试这样做:
<table class ="tablez">
<tr>
<th>Table Title </th>
</tr>
<tr>
<td>
<a tabindex="0" class="clickable">Click Me!</a>
<div id="showedClickable">
<p>This is showed when Click Me! is clicked.</p>
</div><!--EO showedClickable -->
</td>
</tr>
</table>
这是类
#showedClickable {
position:absolute;
display:none;
width:auto;
height:auto;
}
这是您单击时发生的情况。
a.clickable:focus + #showedClickable {
display:block;
}
它在笔记本电脑上的chrome上工作正常,但是当我在手机(iPhone)上尝试此操作时,这不起作用....这里有什么问题??我该如何解决这个问题,解决这个问题?
谢谢你的时间!
我对此有类似的麻烦。问题在于iPhone不会根据CSS中的事件重新绘制兄弟姐妹。
尝试像这样嵌套元素并使用子选择器而不是同级选择器。它通常也更具语义性,因为您单击的项目通常是所显示内容的标题。
奇怪的是,iPad支持将悬停作为点击事件,
<ul>
<li><a href="">Click me</a>
<ul>
<li>This is showed when Click Me! is clicked.</li>
</ul>
</li>
li:hover ul {display: block;}