使用 javascript 显示图像需要帮助答案

【问题标题】：Show images with javascript Help needed使用 javascript 显示图像需要帮助
【发布时间】：2015-08-06 03:04:36
【问题描述】：

我正在制作一个网站，用户在将鼠标悬停在图像上时会看到文字。问题是，它不适用于移动设备（触摸屏等）。所以我一直在编写一个脚本来检测客户端是桌面还是移动，如果它是移动的，它会立即在图像上显示文本。但它并没有真正起作用。有人能找到我的错误吗？这是测试网页的链接：Link。代码可以在头部找到。（对不起，我不知道如何粘贴）

谢谢！

【问题讨论】：

尝试在css的媒体查询中这样做，当屏幕是移动设备时，将悬停的codw复制粘贴到图像标签，无论如何它只是一个如何做的想法而不是实际回答

标签： javascript html css image

【解决方案1】：

bootstrap 之类的东西会自动将您的悬停事件转换为移动设备上的点击事件

另一种选择是使用@media 查询使其在移动设备上可见

use @media(min-width:768px){
    .textOnHover{
        visibility:visible;
    }
}

【讨论】：

【解决方案2】：

您应该对此类任务使用特征检测，而不是浏览器检测。查看Modernizr 以检测客户端浏览器上的触摸功能。然后，您可以使用他们的 JavaScript API 来解决您的问题。

如果您在 Modernizer 构建中选择 CSS 类名称，它会将帮助类添加到您的 <html> 元素中，这样您就可以使用完全 CSS 解决方案，如下所示：

.touch .text {
    visibility:visible;
}

【讨论】：