CODEWITHSUNDEEP
javascriptjqueryhtmliframe
NeoChiri
NeoChiri

Reputation: 334

Scrolling an iframe with jQuery

I'm trying to make a simple exercise with jQuery, it has 3 buttons and 1 iframe. Buttons are Up, Down and Stop. I want that when I click on Up the scroll of the iframe goes to the top in case this has been moved & when clicking on Down it should go to the bottom and when clicking on Stop the scroll should stop. I'm trying to make scroll to top thing but I can't do it. Please check my code & give me a helpful link. Thanks. 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
        <script>
            $(document).ready(function(){
                $("#up").click(function(){
                    $("iframe").scrollTop(500);
                });
            });
        </script>
    <body>
        <input type="button" name="up" value="Up" id="up"/>
        <input type="button" name="down" value="Down" />
        <input type="button" name="stop" value="Stop"/>
        <br>
        <iframe src="poesia.html" id="iframe">
        </iframe>
    </body>

Upvotes: 2

Views: 6719

Answers (1)

Jose Gallo
Jose Gallo

Reputation: 134

I think you are trying to access the content of an iFrame with its source coming from another domain that the one you are using, and that is not possible, this is called the same-origin policy.

You could access and modify the iframe when its source is from the same domain you are using. In that case with $("#iframe").scrollTop(0); or $("#iframe").contents().scrollTop(0) should work.

Upvotes: 2

Related Questions