0

У меня действительно жалкая проблема, но я не знаю, почему это произошло. Я использую сова-карусель 2 с основанием 5, и он отлично работает на всех браузерах, просто выдавая мне вопрос в браузере Safari.конфликт jquery с основанием 5 и совой карусель 2

Вот моя структура файла:

<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.js карусели начать работать на сафари, но когда он находится на карусель стоп горок. Здесь мой код в app.js.

jQuery(function(){ 
    jQuery.noConflict(); 
    jQuery(document).foundation(); 
}); 

И это один в theme.js

jQuery(function(){ 
 
\t "use strict"; 
 
\t jQuery.noConflict(); 
 
\t jQuery(document).ready(function(){ 
 
\t \t //parallax 
 
\t \t 
 
\t \t //carousel 
 
\t \t jQuery('.owl-carousel').each(function(){ 
 
\t \t \t 
 
\t \t \t //var tot = jQuery(this).find("div.item").length; 
 
\t \t \t var owl = jQuery('.owl-carousel'); 
 
\t \t  \t 
 
\t \t \t \t jQuery(".prev").on('click', function() { 
 
\t \t \t 
 
\t \t \t \t  //owl.trigger('prev.owl.carousel'); 
 
\t \t \t \t  owl.trigger('prev.owl.carousel'); 
 
\t \t \t \t }); 
 

 
\t \t \t \t jQuery(".next").on('click', function() { 
 
\t \t \t 
 
\t \t \t \t  owl.trigger('next.owl.carousel'); 
 
\t \t \t \t  //var toIndex = 5; 
 
\t \t \t \t  //owl.trigger("to.owl.carousel", 5); 
 
\t \t \t \t  //owl.trigger('to.owl.carousel', jQuery(this).index()); 
 
\t \t \t \t }); 
 
\t \t \t \t 
 
\t \t  if(jQuery(this).find("div.item").length > 5){ 
 

 
\t \t  \t \t jQuery(this).owlCarousel({ 
 
\t \t  \t \t \t items: 4, 
 
\t \t \t \t  loop: true, 
 
\t \t \t \t  autoplay:true, 
 
\t \t \t \t  autoplayTimeout:3000, 
 
\t \t  \t \t autoplayHoverPause:true, 
 
\t \t  \t \t margin: 0, 
 
\t \t  \t \t responsiveClass:true, 
 
\t \t  \t \t dots:false, 
 
\t \t  \t \t //autoWidth:true, 
 
\t \t \t \t  responsive:{ 
 
\t \t \t   0:{ 
 
\t \t \t    items:1, 
 
\t \t \t    nav:false 
 
\t \t \t   }, 
 
\t \t \t   600:{ 
 
\t \t \t    items:2, 
 
\t \t \t    nav:false 
 
\t \t \t   }, 
 
\t \t \t   1000:{ 
 
\t \t \t    items:4, 
 
\t \t \t    nav:false, 
 
\t \t \t   } 
 
\t \t \t  \t } 
 
\t \t  \t \t }); 
 
\t \t  \t \t 
 
\t \t  \t }else{ 
 
\t \t \t \t 
 
\t \t  \t \t jQuery(this).owlCarousel({ 
 
\t \t \t \t  loop: false, 
 
\t \t \t \t  autoplay:true, 
 
\t \t \t \t  autoplayTimeout:3000, 
 
\t \t  \t \t autoplayHoverPause:true, 
 
\t \t  \t \t margin: 0, 
 
\t \t  \t \t responsiveClass:true, 
 
\t \t  \t \t scrollPerPage : true, 
 
\t \t  \t \t dots:false, 
 
\t \t  \t \t //autoWidth:true, 
 
\t \t \t \t  responsive:{ 
 
\t \t \t   0:{ 
 
\t \t \t    items:1, 
 
\t \t \t    nav:false 
 
\t \t \t   }, 
 
\t \t \t   600:{ 
 
\t \t \t    items:3, 
 
\t \t \t    nav:false 
 
\t \t \t   }, 
 
\t \t \t   1000:{ 
 
\t \t \t    items:4, 
 
\t \t \t    nav:false, 
 
\t \t \t   } 
 
\t \t \t  \t } 
 
\t \t  \t \t }); 
 
\t \t  \t } 
 
\t \t }); 
 
\t 
 
\t }); 
 
    // Define your library strictly... 
 
})();

ответ

1

Я нашедший решение сам. На самом деле основывается также на использовании.

jQuery(document).foundation(); 

И я также использовал

jQuery(document).ready(function(){ 
}); 

так как функция работает нормально на других браузерах, но на сафари его давая confliction вот почему он не работает, так что я просто удалить .ready функцию от темы. js и его решение. возможно, это поможет с кем-то еще

Смежные вопросы