貓頭鷹旋轉木馬在切換鉻標籤後停止

嗨，我正在試驗貓頭鷹旋轉木馬中的自動播放功能，但是每當我切換到另一個網頁選項卡在鉻和回到我的網頁與旋轉木馬，它停止工作，除非我給它一個拖拉的形象。這裏是我的html和jQuery代碼：貓頭鷹旋轉木馬在切換鉻標籤後停止

<!DOCTYPE html> 
    <html> 

    <head lang="en"> 
     <title>MySite</title> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="owl.carousel.min.css"> 
     <link rel="stylesheet" href="owl.theme.default.min.css"> 
     <script type="text/javascript" src="jquery.js"></script> 
     <script src="owl.carousel.min.js"></script> 
    </head> 

    <body> 
     <div class="owl-carousel"> 
     <div> <img src="1.jpg"></div> 
     <div> <img src="2.jpg"></div> 
     <div> <img src="3.jpg"></div> 
     <div> <img src="4.jpg"></div> 
     <div> <img src="5.jpg"></div> 
     <div> <img src="6.jpg"></div> 
     </div> 

    <script> 
    $(document).ready(function(){ 
     var owl = $(".owl-carousel") 
     owl.owlCarousel({ 
     items:1, 
     loop:true, 
     margin:10, 
     autoplay:true, 
     autoplayTimeout:3000, 
     autoplayHoverPause:false 
     }); 

     owl.trigger('play.owl.autoplay',[5000]); 
    }); 
    </script> 
    </body> 

    </html>

來源

2017-01-21 Aaron He

我的hve使用2.2.0版中的保存問題 – naoru

你可以嘗試使用ifvisible.js

，並嘗試使用這兩種.blur否則.focus命令將無法正常工作

這是實現我網站

jQuery(window).ready(function(){ 

var owl = jQuery('.owl-carousel'); 
owl.owlCarousel({ 
    loop:true, 
    margin:10, 
    autoplay:true, 
    autoplayTimeout:2000, 
    dots:false, 
    responsive:{ 
     0:{ 
      items:2 
     }, 
     620:{ 
      items:3 
     }, 
     992:{ 
      items:4 
     }, 
     1200:{ 
      items:6 
     } 
     } 
     }) 
jQuery('.owl-carousel .owl-item').on('mouseenter',function(e){ 
    jQuery(this).closest('.owl-carousel').trigger('stop.owl.autoplay'); 
}) 
jQuery('.owl-carousel .owl-item').on('mouseleave',function(e){ 
    jQuery(this).closest('.owl-carousel').trigger('play.owl.autoplay',[2000]); 
}) 
    ifvisible.blur(function(){ 

     owl.trigger('stop.owl.autoplay',[2000]); 

    }); 

    ifvisible.focus(function(){ 

     owl.trigger('play.owl.autoplay',[2000]);}); 
    }); 

});

我希望這有助於

來源

2017-02-12 17:29:42 YouWillNeverKnow

這裏在回答

$(window).on("blur focus", function(e) { 
    var prevType = $(this).data("prevType"); 

    if (prevType != e.type) { // reduce double fire issues 
     switch (e.type) { 
      case "blur": 
       // do work 
       owl.trigger('stop.owl.autoplay'); 
       break; 
      case "focus": 
       // do work 
       owl.trigger('play.owl.autoplay', [1000]); 
       break; 
     } 
    } 

    $(this).data("prevType", e.type); 
});

試試這個它會工作享受：d

來源

2017-07-13 05:32:57

貓頭鷹旋轉木馬在切換鉻標籤後停止

回答

相關問題