问题出在我正在开发的网站上
http://balticpremier.sem.lv/en/
滚动到底部,查看我们提供的产品部分。它应该在悬停和点击时扩展,它在PC上没有问题。但是,当通过手机访问它时,点击它会产生淡入淡出效果并且没有正确的逻辑。
这是唯一影响这部分的JS:
$('.deliveredCategory').on('click mouseenter mouseleave', function () {
$(this).find(".expandableClient").toggle();
$(this).find('.plus-minus-toggle').toggleClass('collapsed');
$(this).find('.dotHide').toggle();
});
帮助赞赏!!
编辑:忘了说淡入淡出效果不是代码的一部分,只发生在移动设备上。这是怎么切换();在移动设备上解释?无论哪种方式,在移动设备上我也无法在扩展后关闭它。真的很奇怪。
答案 0 :(得分:1)
显然,我正在处理的网站已连接Cloudflare,之前它缓存了我的部分JS代码,这解释了我遇到的问题。我联系了主机管理员,他们刷新了缓存,然后再次运行。
谢谢大家的回答。
答案 1 :(得分:1)
好的,找到了解决方案。我真的希望它满足yopu,如果没有,那么抱歉:)
因此,您可以检查设备是否是触摸设备,以及是否解除鼠标悬停事件。或者你想要的任何其他事件。
var num = 0;
$(".testDiv").on("click mouseover", function() {
num++;
$(".testDiv").text(num)
});
if (!!('ontouchstart' in window)) { //check for touch device
$('.cc').unbind('mouseover');
}
.testDiv {
background: lightgreen;
overflow: hidden;
height: 200px;
color: #fff;
font-size: 40px;
font-weight: bold;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span>Div below uses "click mouseover"</span>
<div class="testDiv">
<p>
Initial text to test whether hovering this works properly. Initial text to test whether hovering this works properly.
</p>
</div>
我希望这就是你想要的。
问候,KJ