scroll to top of a parent of a parent

Question

I have a jquery scroll-to-top code which is working when I have a parent and a iframe within it. However, when I import that parent page into another html page, then the code stopped working. I revised the code accordingly but it is not working.. The below code runs in the child page (iframe).

The old code with single parent (working):

$('.btn.scroll-to-top').click(function(){
    $('html, body', window.parent.document).animate({scrollTop:0}, 'slow');       
});

The revised code with double parent (not working):

$('.btn.scroll-to-top').click(function(){
    {
        $('html, body', $(this).closest('tr').document).animate({scrollTop:0}, 'slow');         
    }
});

Both code works when I scroll to the top in the first parent, but not work in the second parent page that imports the first parent page. What could be wrong with the second code?

Answer 1

window.parent.document works because it is referring to the document of the parent window, ie. the page that contains your iframe.

$(this).closest('tr').document ... doesn't mean anything. It doesn't exist, and because it doesn't exist your jQuery object is empty and empty objects do a whole lot of nothing.

I'm afraid I don't understand what you're trying to do here, but perhaps window.top.document might help you? Or perhaps window.parent.parent.document.