html/css/javascript您现在的位置是:主页 > html/css/javascript >
如何解决Chrome 73中bxSlider项目上的click事件的问题?
2022-03-07 21:16:57html/css/javascript 572人已围观
本文介绍了如何解决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 });
相关文章
随机图文
eyoucms调取当前栏目下的所有tags标签
代码 {eyou:tag typeid='$eyou.field.typeid' getall='0' row='50' sort='hot'} <a href="{$field.link}">{$field.tag}</a> {/eyou:tag}pbootcms您访问的页面不存在,请核对后重试!
这个问题很大可能就是伪静态没有配置。 伪静态具体怎么配置可以自行百度解决。 如有需要技术支持可以联系我们客服人员。pbootcms后台编辑器上传图片使用绝对地址
网站开启https后想把全站内容https化,但是发现文章内容中的图片不是绝对地址,需要把图片地址改成绝对地址。 效果如图所示 修改方法哀悼日 让网站全站变灰css代码
此代码为提取百度官方的css代码。 html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);-ms-filter:grayscale(100%);-o-filter:grayscale(100%)