Question

我在网站上有一个tumblr博客。我正在使用scrollpane。见http://danmccarthy.net/news/

我的问题是博客的按钮分页会将iframe重新加载到下一页但是我无法想象一旦iframe重新加载并实现了滚动窗格，如何滚动到父页面的顶部。

我尝试了下面的成功

iframe onload="window.parent.parent.scrollTo(0,0)"

和

$('#exhibit iframe').load(function(){
     $(window).scrollTop(0);
});

下面是全身滚动的滚动窗格

$(function()
{
var win = $(window);
var isResizing = false;
win.bind(
    'resize',
    function()
    {
        if (!isResizing) {
            isResizing = true;
            var container = $('#exhibit');
            container.css(
                {
                    'width': 1,
                    'height': 1
                }
            );
            container.css(
                {
                    'width': win.width(),
                    'height': win.height()
                }
            );
            isResizing = false;
            container.jScrollPane(
                {
                    autoReinitialise: true,
                }
            );
        }
    }
).trigger('resize');
$('body').css('overflow', 'hidden');
if ($('#exhibit').width() != win.width()) {
    win.trigger('resize');
}
});

这就是HTML

<div id="wrapper">
<div id="wrap-top">

   <!-- Header and Menu -->

</div>

<div id='exhibit'>
    <div class='container'>
        <div class='right'>

            <!-- iframe -->

        </div>
    </div>
</div>

</div>

Answer 1

以下是我测试的内容，如果我理解你的问题，这就像你正在寻找的那样：

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
</head>
<body>

<div id="divTest">
    <h1>First Heading</h1>
    <h1>Second Heading</h1>
    <h1>Third Heading</h1>
    <h1>Fourth Heading</h1>
    <h1>Fifth Heading</h1>
    <h1>Sixth Heading</h1>
    <h1>Seventh Heading</h1>
    <h1>Eigth Heading</h1>
    <h1>Ninth Heading</h1>
    <h1>Tenth Heading</h1>
    <h1>Eleventh Heading</h1>
    <h1>Twelth Heading</h1>
    <h1>Thirteenth Heading</h1>
</div>

<iframe id="frmTestFrame" height="500px" width="800px" src="http://www.reddit.com"></iframe>

<script type='text/javascript'>
    var self = this;

    $(document).on('ready', function() {
        $("#frmTestFrame").on('load', function() {
            self.scrollTo(0,0); 
        });
    });

</script>
</body>
</html>

我希望这会对你有所帮助。

iframe重新加载，如何使用Scrollpane将父页面滚动到顶部

1 个答案: