我需要为网站服务的特定浏览器/设备遇到问题。

本质上,我有锚标签,当单击它们时会显示隐藏的元素。除iOS以外,其他所有功能(PC上的Firefox / Chrome / IE,Android FF / Chrome /浏览器)都可以正常使用。单击“查看生物”链接时,文本应过渡并显示。在iOS上执行此操作时,灰色框会悬停在元素上(因此我认为它知道那里有东西),但是它不会显示隐藏的元素。

经过一些研究,我可以发现iOS处理“onclick”的方式可能存在问题,或者有某种影响。我尝试实现一些不同的东西(主要是基于Java的东西),尽管它们没有用。它们可能并不是我真正需要做的,因为此实现完全基于HTML / CSS,但是我已经尝试了遇到的所有问题。通常,所涉及的大多数修补程序都不涉及隐藏的元素,而更常见的是简单的“滚动指向”实现。可能是同一回事。

据我所知,在我阅读的文章/现有帮助页面中,iOS锚标记存在某种错误或不喜欢。它可能不适用,但根据某些用户的说法,iOS不提供“onclick”或“click”服务,而是使用某种形式的“touch”。

有没有解决方法?只要它按预期为iOS用户提供服务,是否有点混乱也没关系。如果有一种方法可以监听“点击”并将其视为iOS的“触摸”,那可能是最简单的解决方案。我不是专家,所以我可能做不到。

我的代码:

<div class="dimg">
<img src="images/profile_1.png" alt="director1" height="200" width="200" class="img-responsive" style="border:2px solid #535353;">
</div>
<a href="#" class="showme" onclick="return false">View Bio</a>
<div id="desk" class="trans">
  <p>This is the text to be displayed when the anchor is clicked</p>

CSS:
.showme {
 text-decoration:none;
 color:#535353;
 letter-spacing:1px;
 }

.showme:focus + #desk {
 opacity:1;
 visibility:visible;
 position:relative;
 }

#desk {
visibility:hidden;
opacity:0;
position:absolute;
border-radius:10px;
margin-top:10px;
text-align:left;
}

最佳答案

iOS Safari上的CSS :focus存在问题。

this question的答案似乎有效。您需要在链接中添加tabindex="1":

<a href="#" class="showme" onclick="return false" tabindex="1">View Bio</a>

https://jsfiddle.net/1kqxopzs/

07-24 09:38
查看更多