Iframe reloaded, how to scroll parent page to top with Scrollpane

Question

I have iframed a tumblr blog on a website. I am using scrollpane. See here http://danmccarthy.net/news/

My problem is that the buttons pagination of the blog reload the iframe to the next page but I can't figurate how to scroll to top the parent page once the iframe has reload with the scrollpane implemented.

I tried with out success the following

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

And

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

Below is the scrollpane script for full body scroll

$(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');
}
});

And that's the 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>

score 1 · Accepted Answer · answered Jun 21 '13 at 05:15

Here is what I had for testing and if I understand your question right, this is something like what you are looking for:

<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>

I hope this helps you.

Iframe reloaded, how to scroll parent page to top with Scrollpane

1 Answers1