Galleria API enterFullscreen只在頁面加載時才起作用

我在我的網頁上使用經典主題的環球免稅店圖片庫（http://galleria.io/）。我想添加一個按鈕，使用戶進入全屏模式。所以，我看了一下這個API，它看起來很簡單：我嘗試了幾次，最後纔開始工作。問題是：第一次打開html文檔時效果很好，但當我關閉全屏模式時（通過按Esc或單擊十字），然後嘗試再次打開它（通過單擊鏈接到的鏈接）它不起作用。它看起來像試圖打開，但有些東西阻止它，因爲它顯示了一秒鐘。我不知道爲什麼會發生這種情況，有人可以幫我嗎？Galleria API enterFullscreen只在頁面加載時才起作用

我的HTML：

<style> 
    .content{width:700px;height:800px;margin:20px auto;} 
     #galleria{height:700px} 

    </style> 

    <!-- load jQuery --> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script> 

    <!-- load Galleria --> 
    <script src="../../galleria-1.2.8.min.js"></script> 

    </head> 
    <body> 

     <div class="content"> 

       <!-- the link for fullscreen mode --> 
       <a id="fullscreen" href="#"> fullscreen </a> 

       <div id="galleria"> 

     <!-- and then all the images just like they were when opening the classic theme demo html --> 
    </body>

而且我的javascript：

<script> 

Galleria.ready(function() { 
    var gallery = this; 


     gallery.attachKeyboard({ 

      left: gallery.prev, 
      right: gallery.next, 

     }); 

$("#fullscreen").click(function() { 

      gallery.enterFullscreen(); 

     }); 





    }); 



// Initialize Galleria 

Galleria.run("#galleria") 

    // Load the classic theme 
Galleria.loadTheme('galleria.classic.min.js'); 
</script>

來源

2012-10-24 Cláudia Marques

萬一有人真的有同樣的奇怪的問題，因爲我做了，我發現它的答案：在全屏WASN」因爲默認設置在某種程度上與它衝突......（因爲我將全屏功能附加到標籤）。

因此，基本上我在enterfullscreen（）之前添加了一個event.preventDefault（）。

工作代碼：

// Load the classic theme 
Galleria.loadTheme('galleria.classic.min.js'); 

// Initialize Galleria 
Galleria.run("#galleria", { 

extend:function() { 
    var gallery = this; 


     gallery.attachKeyboard({ 

      left: gallery.prev, 
      right: gallery.next, 

     }); 

$("#fullscreen").click(function() { 

      event.preventDefault(); 

      gallery.enterFullscreen(); 

     }); 

}

來源

2012-10-29 16:21:44

Galleria API enterFullscreen只在頁面加載時才起作用

回答

相關問題