html/css/javascript您现在的位置是:主页 > html/css/javascript >
如何解决Chrome 73中bxSlider项目上的click事件的问题?
2022-03-07 21:16:57html/css/javascript 769人已围观
本文介绍了如何解决Chrome 73中bxSlider项目上的click事件的问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
在Chrome更新到版本73之后,不会触发bxSlider的内部项目单击事件,也就是href超链接无效,但是火狐浏览器下正常。
如何为新的Chrome中的元素触发.on('click')事件?
当幻灯片在移动时会在Chrome中触发,在FireFox中一切都很好
<div class="slider-pager"> <div class="slider-pager__item"><a href="https://www.baidu.com/"><img src="1.jpg" alt=""></a></div> <div class="slider-pager__item"><a href="https://www.baidu.com/"><img src="2.jpg" alt=""></a></div> </div> <script> carouselProduct = $('.slider-pager').bxSlider({ maxSlides: 3, minSlides: 3, slideWidth: 90, infiniteLoop: false, moveSlides: 1, slideMargin: 8, pager: false, nextSelector: '.slider__nav--next', prevSelector: '.slider__nav--prev', nextText: '→', prevText: '←' }); </script>
推荐答案
貌似最新的Chrome更新使bxSlider内部的任何点击都以容器为目标,而不是容器内部的链接。
在选项中添加touchEnabled: false可以禁用滑动行为,但可以解决单击问题。例如:
carouselProduct = $('.slider-pager').bxSlider({ maxSlides: 3, minSlides: 3, slideWidth: 90, infiniteLoop: false, moveSlides: 1, slideMargin: 8, pager: false, nextSelector: '.slider__nav--next', prevSelector: '.slider__nav--prev', nextText: '→', prevText: '←', touchEnabled: false });
专注中小企业网站建设,网站安全15年,熟悉各种CMS建站系统,善于解决各种网站疑难杂症。有需要请联系下方微信!
解决问题仅需10元起!
技术微信
扫码联系技术微信
---------------专业解决网站各种疑难杂症,可淘宝担保交易,安全无风险---------------
建站、仿站、二次开发、网站改版、网站修改、网站漏洞修复、网站被黑修复、网站安全、服务器安全等
点击了解更多 >>