javascript - 在 IFrame 中运行 Skrollr

标签 javascript jquery iframe skrollr

我正在尝试在 IFrame 中运行一些非常简单的 Skrollr 动画。当我使用简单的 HTML Skrollr 填充 IFrame 时,将错误输出到控制台(在 FireFox 中):

“格式不正确”

我已经确认 IFrame 内容是正确的,并且如果它们不在 iframe 中并且在标准网页中,则运行得很好。我已经确认 Skrollr javascript 文件已成功加载。所有CSS、JS和图像都与父网页位于同一域中,因此不会发生跨域。当内容放置在 IFrame 中时,问题就会出现。这让我认为这是一个跨脚本问题,或者 Skrollr 被编码为检测跨域/跨脚本?

知道出了什么问题以及如何克服这个问题吗?如果您愿意,我可以提供一个简单的例子。希望引起 Prinzhorn 的注意,是的,我知道 Skrollr 目前尚未维护,并且 IFrame 未得到正式支持,但如果我知道出了什么问题或问题是什么,我可以 fork Skrollr 并添加此功能。

编辑:这是一个简单的 JSFiddle示例

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Tasks</title>
    <style>

        #main-container {
                width            : 1200px;
                height           : 1000px;
                background-color : #eee;
        }

        iframe {
            width: 100%;
            height: 100%;
            overflow: scroll;
        }

    </style>
</head>

<body>

    <div class="container text-center">

        <button id="load-btn">Load Iframe</button>

        <br/>

        <div id="main-container" class="text-center">
            <iframe id="mf-preview" frameborder="0"></iframe>
        </div>

    </div>

    <!-- Javascript files -->
    <script src="js/custom.js"></script>
</body> 
</html>

最佳答案

兄弟一切顺利

当 iframe 的大小超过 1000px 时,它将显示滚动条

例如:

<iframe id="mf-preview" src="http://onhax.net" frameborder="0"></iframe>

我添加了大于1200px的iframe源 添加后,它会显示滚动条

查看JSFiddle

关于javascript - 在 IFrame 中运行 Skrollr,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32751713/

相关文章:

javascript - 如果输入为空 jquery,则禁用提交

css - 如何使用 iframe 设置 Blogger 小工具的样式并使用样式设置自己的头部

html - 包含 iframe 的页面中的选项卡(键盘)导航

javascript - 垂直和水平可滚动表格

javascript - 如何从外部源捕获console.log?

javascript - 如何在调用查询方法后读取并获取 Angular Controller 中的 $scope 信息

javascript - 如何检查一个表是否有具有特定ID的jquery行

javascript - DOM 父元素与父节点

javascript - 咕噜任务 : Delete lines between markers in an HTML file

javascript - 使用 JavaScript 获取下拉选项的名称