Fancybox - Multiple PDF - 無法在文檔中上下滾動

我正在使用fancybox，但是當我有一個PDF圖像數組時，導航箭頭允許您在PDF文檔之間進行切換通過文檔等滾動。Fancybox - Multiple PDF - 無法在文檔中上下滾動

我已經創建了一個小提琴顯示問題，我將不勝感激任何幫助。

問候

湯姆

<a class="fancybox">Click to show pdf</a>

$(".fancybox").click(function(){ 
var photoArray = []; 
photoArray.push({ href: 'http://samplepdf.com/sample.pdf' , type: 'iframe' }); 
photoArray.push({ href: 'http://samplepdf.com/sample.pdf' , type: 'iframe' }); 
photoArray.push({ href: 'http://samplepdf.com/sample.pdf' , type: 'iframe' }); 
photoArray.push({ href: 'http://samplepdf.com/sample.pdf' , type: 'iframe' }); 


$('.fancy').fancybox(); 
     $.fancybox.open(photoArray, { 
      'openEffect': 'elastic', 
      'closeEffect': 'elastic', 
      'nextEffect': 'fade', 
      'openSpeed': 600, 
      'closeSpeed': 200, 
       autoSize : false, 
       beforeLoad : function() {      
        this.width = 1000; 
        this.height = 800; 
       }, 
       helpers: { 
        overlay: null 
       //buttons: {} 
      }, 
       iframe: { 
        preload: false 
       } 
     });

}）;

來源

2013-08-21 user2039547

-1

問題是該框的「箭頭」正在覆蓋滾動條。有兩種方法：

1）刪除箭頭。

只需添加這到的fancybox：

"arrows" : false

一個JSFiddle顯示差異。

2）風格箭頭

這會採取更多的工作，但你可以嘗試將它們移動，添加填充等。無論如何，我相信他們會造成問題，最好的辦法是剛落他們完全。

來源

2013-08-21 12:53:36 Richard

刪除箭頭可能不是一個好主意。我寧願認爲選項是1）。使用按鈕助手或2）。移動箭頭建議在http://fancyapps.com/fancybox/#useful No.5 – JFK

@JFK它可能不是一個好主意。但在這個層面上（「爲什麼我不能滾動？」），我只是想指出問題所在。我確信有幾種方式來設計/移動/排列箭頭，這就是我提到它的原因。 – Richard

我不想在這裏開始爭論，但如果你刪除箭頭，那麼你可能無法瀏覽圖庫中的項目......你修補了一個洞但打開了一個新的;）然後你建議風格箭頭，但你沒有提供一個方法來做到這一點，最後，你的結論是，這是一個有問題的解決方案，所以最好的辦法是「完全放棄它們」......這怎麼可能是一個被接受的答案？只是想知道;） – JFK

<style type="text/css"> 
    .fancybox-prev { 
     left: -70px; 
     height: 10px; 
     width: 10px; 
     vertical-align: central; 
     top: 50%; 
    } 

    .fancybox-next { 
     right: -70px; 
     height: 10px; 
     width: 10px; 
     top: 50%; 
    } 

    .fancybox-nav span { 
     visibility: visible; 
    } 
</style>

來源

2014-01-09 16:54:09 user3162529

Fancybox - Multiple PDF - 無法在文檔中上下滾動

回答

相關問題