对IOS /移动设备的悬停效果,我已经绑定:active:hover和:focus

时间:2017-07-03 10:55:04

标签: javascript jquery html ios css

我目前正在使我的网站具有响应性和移动友好性,我的网站使用:在桌面浏览器中悬停很多,以便用户获得更多信息和一般网站效果。

我使用的其中一个地方是产品规格页面:

http://cameras.specced.co.uk/compare/268/Canon_EOS_200D

请点击并按住桌面浏览器中的某个规范项,它应如下所示:

enter image description here

我想在移动设备上重拍这个效果,我尝试过使用:active和:focus,这两个都可以解决问题。

另一个问题是搜索栏,在桌面浏览器中,搜索栏显示并在鼠标悬停在CSS中时消失

enter image description here

请在移动浏览器中尝试搜索栏:http://cameras.specced.co.uk

当您单击右上角的搜索图标时,悬停效果会激活并显示搜索栏,但是当您按下显示屏上的任何其他位置时,它不会消失。

我没有在这里发布CSS代码,因为它非常简单,只有display:none和on:hover的图标显示:block ....我已经尝试了active和focus并读取了很多其他堆栈溢出关于此的帖子然而无法使其发挥作用。

如果您在移动设备上测试了这一点,我将不胜感激,看看我提到的效果。谢谢你

0 个答案:

没有答案