fancybox滾動不顯示在iPad上，但在瀏覽器中顯示

Question

我有a page where the scrollbar in the fancybox is not displayed from iPad but is displayed from Google Chrome from Desktop URL是http://jsfiddle.net/wqm0x21n/1/您可以滾動fancybox內容，但是從iPad訪問時沒有垂直滾動條。

任何想法如何使其工作？ 任何解決方案發現爲SO如申請：

#fancybox-inner{ 
    overflow:scroll; 
    -webkit-overflow-scrolling:touch; 
} 

沒有幫助。

這裏是的jsfiddle代碼，如果需要的話：

JS：

$(".fancyTrigger").fancybox({ 
    fitToView: false, 
    autoSize: false, 
    afterLoad: function() { 
     this.width = 200; 
     this.height = 200; 
    } 
}); 
$(".fancyTrigger").trigger('click'); 

CSS：

#TheFancybox { 
    display: none; 
} 

#fancybox-inner{ 
    overflow:scroll; 
    -webkit-overflow-scrolling:touch; 
} 

Answer 1

嗯，我已經採取了你的代碼定睛一看，取得了以下爲您進行調整：

1. 雖然在你引用css，但是你在html中缺少＃fancybox-inner div容器元素。看到這個更新的jsfiddle：http://jsfiddle.net/nxn46e3t/

2. 已經修改了你的CSS所以父母DIV是滾動參考，我們還需要告訴它有多大是（因此width和height屬性設置爲100％）

body { 
     background-color: #eef;  
    } 
    #TheFancybox { 
    overflow:auto; 
    -webkit-overflow-scrolling:touch; 
    width: 100%; 
    height: 100%; 
    } 

    #fancybox-inner{ 

    } 

我對IOS測試，現在你的滾動條滾動時出現：

完整的工作jsfiddle的例子可以在這裏找到（如上）http://jsfiddle.net/nxn46e3t/

讓我知道這是如何適用於你。

祝你好運！