您好, 欢迎来到 !    登录 | 注册 | | 设为首页 | 收藏本站

如何在启用触摸的浏览器中通过触摸模拟悬停?

如何在启用触摸的浏览器中通过触摸模拟悬停?

好的,我已经解决了!它涉及稍微更改CSS并添加一些JS。

使用jQuery使其变得容易:

$(document).ready(function() {
    $('.hover').on('touchstart touchend', function(e) {
        e.preventDefault();
        $(this).toggleClass('hover_effect');
    });
});

用英语:当您开始或结束触摸时,请打开hover_effect关闭课程。

然后,在您的HTML中,将类悬停添加到您要与此一起使用的任何内容上。在CSS中,替换以下任何实例:

element:hover {
    rule:properties;
}

element:hover, element.hover_effect {
    rule:properties;
}

只是为了增加实用性,也可以将其添加到CSS中:

.hover {
-webkit-user-select: none;
-webkit-touch-callout: none;        
}

要停止浏览器要求您复制/保存/选择图像或其他操作。

简单!

其他 2022/1/1 18:16:55 有432人围观

撰写回答


你尚未登录,登录后可以

和开发者交流问题的细节

关注并接收问题和回答的更新提醒

参与内容的编辑和改进,让解决方法与时俱进

请先登录

推荐问题


联系我
置顶