CODEWITHSUNDEEP
jqueryiframescrollsrc
Lou_Ds
Lou_Ds

Reputation: 551

jquery, how to Scroll iFrame with source from outside site?

I am trying to have an iframe on my site that will load a site from the internet *and* automatically perform a scroll down scroll (animate).

It works if I have as a src a simple page (local) with some content but when i change the src to and external source, it does not longer works.

the 'ticks' variable don't get incremented, loos like it loses the scope, what is going on?

Here is an example:

<html>
     <head>
        <title></title>
      </head>

    <body style="margin:0px;padding:0px;overflow:hidden">

    <iframe height="100%" id="frame" src="http://plugins.jquery.com" scrolling="yes"  ></iframe>

</body>

    <script type="text/javascript" src="./js/jquery-1.6.2.min.js"></script>
    <script type="text/javascript">

   var ticks = 1;

    $(document).ready(function() {
        self.setInterval("scrolldown1("+(ticks+1)+")",5000);
    });


    function scrolldown1(tick) {
        alert("scrolldown" +  ticks);
        $("#frame").contents().scrollTop(ticks*100);
        ticks = ticks + 2;
    }


    </script>

</html>

Thanks for your time, I cannot understand why it does not scroll when I src and external site!

Upvotes: 2

Views: 2691

Answers (1)

Magnus Engdal
Magnus Engdal

Reputation: 5634

Because of the same-origin policy, it's not really possible.

One way to solve it is to load the entire third party website in a very long iframe, put that iframe in a div with overflow: auto and then scroll the div instead.

Upvotes: 2

Related Questions