我有一个非常可悲的问题，但我不知道它为什么会发生。我正在使用 owl carousel 2 和基础 5，它在所有浏览器上都可以正常工作，只是在safari 浏览器中给我带来了问题。
这是我的文件结构：
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/foundation/js/foundation.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" src="js/theme.js"></script>
<script type="text/javascript" src="js/owl.carousel.min.js"></script>
</body>
</html>
当我移除app.jscarousel 时开始在 safari 上工作，但是当它在 carousel 上时停止幻灯片。这是我的代码app.js。
jQuery(function(){
jQuery.noConflict();
jQuery(document).foundation();
});
而这个在 theme.js
jQuery(function(){
"use strict";
jQuery.noConflict();
jQuery(document).ready(function(){
//parallax
//carousel
jQuery('.owl-carousel').each(function(){
//var tot = jQuery(this).find("div.item").length;
var owl = jQuery('.owl-carousel');
jQuery(".prev").on('click', function () {
//owl.trigger('prev.owl.carousel');
owl.trigger('prev.owl.carousel');
});
jQuery(".next").on('click', function () {
owl.trigger('next.owl.carousel');
//var toIndex = 5;
//owl.trigger("to.owl.carousel", 5);
//owl.trigger('to.owl.carousel', jQuery(this).index());
});
if( jQuery(this).find("div.item").length > 5){
jQuery(this).owlCarousel({
items: 4,
loop: true,
autoplay:true,
autoplayTimeout:3000,
autoplayHoverPause:true,
margin: 0,
responsiveClass:true,
dots:false,
//autoWidth:true,
responsive:{
0:{
items:1,
nav:false
},
600:{
items:2,
nav:false
},
1000:{
items:4,
nav:false,
}
}
});
}else{
jQuery(this).owlCarousel({
loop: false,
autoplay:true,
autoplayTimeout:3000,
autoplayHoverPause:true,
margin: 0,
responsiveClass:true,
scrollPerPage : true,
dots:false,
//autoWidth:true,
responsive:{
0:{
items:1,
nav:false
},
600:{
items:3,
nav:false
},
1000:{
items:4,
nav:false,
}
}
});
}
});
});
// Define your library strictly...
})();