Log in

View Full Version : Auto scroll in iFrame



Moglizorz
06-22-2008, 01:33 PM
I have an IFrame on a page.
As soon as the page loads, I want that iFrame to have scrolled down. (Basicly ignoring the content at the top of that iFrame).


Kinda like this is the content of the iFrame:

Unwanted content

Some stuff

[
[
[ The only bit I want to see.
[
[


The frame will only be 5 "lines" high, so it should scroll down, and I should only see;

[
[
[ The only bit I want to see.
[
[

I want it to scroll to that point without the user having to do anything. Does anyone know a nice script? :P

I hope I explained what I meant properly :/

Nile
06-22-2008, 04:32 PM
What you can do is have a div on the bit that you only want to see:


Text up here....
<div>Text...</div>
And then give it an id, so lets say "bit":


Text up here....
<div id="bit">Text...</div>

And then on the iframe parent page, do it like this:


<iframe src="page.html#bit"></iframe>

For this to work though your Iframe needs to be scrolling.
So for an example, there's a div on this page called footer, so I can run this code:


<iframe src="http://www.dynamicdrive.com/forums/showthread.php?t=33669#footer" height="700" width="1000"/>

And it will go straight to the bottom(witch is where the footer div is), when the iframe loads.

Moglizorz
06-22-2008, 05:23 PM
The thing is, the page is not mine. It's an external page, and has no "id" tags on anything.
Any ideas?
I read something about "window.scroll(0,0);", not sure what it is, but if it worked, how would I make it happen "on load" within the iFrame? :/

Nile
06-22-2008, 05:34 PM
Hmm, I got nothing then. Sorry. :(

Moglizorz
06-22-2008, 05:36 PM
Any idea how to get this;
http://www.dynamicdrive.com/dynamicindex2/manualscroll.htm

to work, but on page load?

rainarts
09-10-2008, 08:32 AM
Just for fun!


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

<script type="text/javascript">
<!-- BEGIN HIDING

window.onload = pageScroll; function pageScroll() {
window.scrollBy(0,50);
scrolldelay = setTimeout('pageScroll()', 300);
/* Increase this # to slow down, decrease to speed up scrolling */
}
// DONE HIDING-->
</script>

</head>
<body>
<div>
<iframe id="someid" src="somepage.html"> </iframe>
</div>
</body>
</html>

own3d
10-12-2008, 06:23 PM
Guys i realy need this too,
please how to auto scrolldown External content that goes inside the iframe?

PD: the iframed page is not mine.

chaglen
03-26-2009, 02:19 PM
Hi,

I've found a "creative" solution to this IFRAME auto-scroll issue...

Solution? Create a container-DIV, set a fixed height on it (For ex: style="height: 1000px"), then use an auto-scroll

script to scroll down the page.

Now...

For the IFRAME: set it up as you wish (with attributes, styling, etc.), but create a fixed height (For ex:

style="height: 1000px"), preferably the same as the DIV. The DIV should surround (be the container of) the IFRAME

itself.

Now, the DIV and the IFRAME will be of the same height, and the scrolling script will give the APPEARANCE that the

IFRAME itself is scolling down, while it's actually the containing DIV (page) that does it.

I hope this helps!

- Christian Aglen


Example script:
-------------------------------------
<script language=JavaScript>

function ScrollDown() {
window.scrollBy(0,10);
scrolldelay = setTimeout('pageScroll()',100);
}

window.onload=ScrollDown;

</script>

<div style="height: 1000px;">

<iframe src="http://www.urlgoeshere.com" frameborder="0" scrolling="no" marginwidth="0" marginheight="0" width="100%"

height="1000px" style="padding: 0; margin: 0; border: 0;"></iframe>

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

bboyse
06-30-2010, 03:26 AM
The following you need to know if you want an IFRAME to scroll itself
1) if you are Planning to scrool it you MUST* have the same domain/subdomain into iframe target (src)
2) Mayby some settings on INTRANET are required. (IE) "*MAYBY**

here its the code:

<iframe id="x1" src="mydomain.com/file.php">Unsupported</iframe>

<script>
function xfunc(){
var a = document.getElementById('x1').contentWindow;
a.scrollTo(0,200);/*scroll down [bboyse]*/
}
</script>

THATS ALL.