Question

我正在使用colorbox打开一个iframe，我在其中调用jscrollpane以允许滚动。它有效，但在某些情况下（并非全部，看不到模式），可能会切断100px左右的低位。此外，我无法让滚动条出现在ipad上。

有什么想法吗？ http://www.ainonline.com/newsmakers/2011

点击时间线中的链接，看看我的意思。

Answer 1

这里你加载的页面在主体（用户代理样式表）上有8px的边距，这导致页面有点偏向右下角。然后看起来你错过了部分页面。

投资保证金：0px;在身体元素上：

body {
    margin: 0px;
}

Answer 2

在通过iframe包含的每个页面上，您必须确保明确说明正文的边距：

body {
  margin: 0px;
}

如果您不这样做，浏览器将使用它的默认设置，这意味着不同浏览器的结果也不同。

您应该查看：normalize.css

这是一个样式表，旨在将所有浏览器重置为相同的标准样式规则。

Answer 3

嗯，我看到的模式是最后一个文本块有时会有一个段落标记，有时不会，这恰好与文本是否完全显示一致（ with <p>...</p>）或部分文字保持隐藏状态（没有 <p>...</p>）。

不会显示最后一段文字：

<div class="articleview scrollpane" style="width:650px">
    <h1>Former Platinum Jet Pilot Gets Six Months Prison Time</h1>
    <div class="pubdate" style="color:#666; margin:10px 0; font-style:italic">August 23, 2011 - 3:20 PM</div>
    Blah blah blah [...] blah.
</div>

将显示最后一段文字：

<div class="articleview scrollpane" style="width:650px">
    <h1>Former Platinum Jet Pilot Gets Six Months Prison Time</h1>
    <div class="pubdate" style="color:#666; margin:10px 0; font-style:italic">August 23, 2011 - 3:20 PM</div>
    <p>Blah blah blah [...] blah.</p>
</div>

如果这解决了这个问题，请告诉我。

对于问题的其他部分（实际上应该在另一个问题中提出），iPad不会在网站上使用滚动条。它使用手势。不过不用担心 - 网站效果很好。

Answer 4

我有类似的问题......这是我的解决方案

$(".gallery").colorbox({
            iframe:true,
            fastIframe:false,
            width:"630px",
            height:"555px",
            scrolling: false,
            rel:'gallery', 
            slideshow:false, 
            onComplete:function(){ $(".cboxIframe").contents().find("body").css("margin","0px");
                //$("#banner").insertBefore("#cboxLoadedContent")
            }
        });

彩盒内的jscrollpane - iframe的底部被切断了？

4 个答案: