Log in

View Full Version : Problem in iframes ?


M rosi
02-23-2011, 06:42 AM
hi,
i want to open a iframe with it parent page, when click link on another parent page.
as an example,

parent_1.html

<html>
<body>

<!--logo, header & main details-->

<!--iframe contain only the content-->
<p><iframe src="parent_1-iframe.html" width="100%" scrolling="no" height="100%"></iframe></p>

<!--footer & other details -->
</body>
</html>

parent_1-iframe.html

<html>
<body>

<div >

content content content content content content
content content content content content content
content content content content content content
content content content content content content
content content content content content content

<!--when click on "CLICK HERE"(link in the parent_2.html)
should come to this place with parent_1.html -->
content content content content content content

content content content content content content
content content content content content content

</div>

</body>
</html>


parent_2.html

<html>
<body>

<!--logo, header & main details-->

<!--iframe contain only the content-->
<p><iframe src="parent_2-iframe.html" width="100%" scrolling="no" height="100%"></iframe></p>


<a href="?????">CLICK HERE</a>


<!--footer & other details -->
</body>
</html>


when click on "CLICK HERE" (link in the parent_2.html), it should go to middle of the parent_1-iframe.html with it's parent page (parent_1.html).
because when just open parent_1-iframe.html, it will not contain header, logo & footer. so i could not use,

parent_2.html

<a href="parent_1-iframe.html#mylink">CLICK HERE</a>

parent_1-iframe.html

<a name="mylink"></a>


I hope you understand my problem... so please someone help me....
thanx.

.
M rosi
02-24-2011, 12:55 PM
is it impossible????
please someone help me..................
mat420
02-24-2011, 05:10 PM
ok im not sure which problem you mean so im going to answer both and hope that one of them are right on informing you.

to use iframes, as far as i know most poeple create an html file for each NEW content they want brought into the frame. they can use a link to call that html file INTO the iframe.

now, to jump down to a certain section of a page is a different story, im not sure how thatd be done within the iframe if the button is OUTSIDE of the iframe but let me know if this is what u mean and ill grab you the code. what this does is when you click a button, it scrolls down to the part of the page that you put the key word (hidden)
so if i make the button go to key word FROGSANDBUTTONS
and i put the word FROGSANDBUTTONS all the way 3/4s of the way down a vertically long page, it will jump down to where ever i put it.
Beverleyh
02-24-2011, 05:25 PM
Googling something like 'anchor in iframe' should help
molendijk
02-24-2011, 11:55 PM
Hello M rosi,
You want a link in an iframed page to go to an anchor in another iframed page, where the iframed pages are not contained in the same main page. I googled around, no success.
So I made a script of my own (see below). The important thing to note is that you cannot go from an iframed page (contained in a main page MP1) to an anchor in another iframed page (contained in another main page MP2) unless you have the 2 iframed pages encompassed by one and the same main page (other than MP1 and MP2). Let's call that main page 'index.html'. Also, the iframed pages should be dynamically generated. Let's call them 'parented_1.html' and parented_2.html, respectively.
With this in mind, try the following:
index.html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title></title>
<style type="text/css">
iframe {position: absolute; left:10%; top: 10%; width:89%; height: 89%; border:1px solid black; background: white}
body {background: #dedede}
</style>

<script type="text/javascript">
contentURL = parent.document.URL.substring(parent.document.URL.indexOf('?')+1, parent.document.URL.length);
if (top.location == contentURL)top.location.href='index.html?parented_1.html';
onload=function()
{
var OBJ = document.createElement("iframe");
OBJ.setAttribute("src", contentURL);
OBJ.setAttribute("name", contentURL);
OBJ.setAttribute("id", "content");
OBJ.setAttribute("frameborder", "0");
document.body.appendChild(OBJ);
}
</script>

</head>

<body><div>

<a href="index.html?parented_1.html">parented_1.html</a><br>
<a href="index.html?parented_2.html">parented_2.html</a>
</div></body>
</html>
parented_1.html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title></title>
<script type="text/javascript">
function orph(){
if (top.location == self.location)
top.location.href="index.html?" + document.URL
}
window.onload=orph;
</script>
</head>

<body><div>
This is parented_1.html, iframed in index.html<br>
<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>
<a name="mylink"></a>WE LAND HERE COMING FROM A LINK IN parented_2.html<br>
<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br><br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br><br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>bla<br>
</div>
</body>
</html>

parented_2.html:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title></title>
<script type="text/javascript">
//This keeps the iframed pages from showing without their main page
function orph(){
if (top.location == self.location)
top.location.href="index.html?" + document.URL
}
window.onload=orph;
</script>
</head>
<body><div>
This is parented_2.html, iframed in index.html<br>
<a href="javascript: void(0)" onmousedown="top.location.href='index.html?parented_1.html#mylink'" >go to an anchor in parented_1.html, also contained in index.html</a>
</div></body>
</html>

Arie Molendijk.
M rosi
02-25-2011, 05:32 PM
it s nice code. thank you for helping meee... :)

but it's not the exactly solution what i want. what i really want is,

there should be 2 different parent pages (lets say "index.html" & "other.html") for different iframes ("parented_1.html" & "parented_2.html")

index.html ------> parented_1.html
other.html ------> parented_2.html

i will explain by your symbols.....


when we are in the "index.html", the iframe is "parented_1.html" (it's fine).
when we click the link parented_2.html on "index.html" it should straightly (do not want to give a another link to go to middle of the )"parented_1.html"go to middle of the "parented_2.html" (not middle of the "parented_1.html")
since different iframe has different parent page, "parented_2.html" should open with it's own parent page which is "other.html"


in other word when click the link parented_2.html on "index.html" should open "other.html" with it's iframe "parented_2.html" which has scrolled to middle of the iframe.

it's very confuse. but i hope you will not misunderstand this.

thank you once again. hope you help me.........
molendijk
02-26-2011, 12:20 AM
in other word when click the link parented_2.html on "index.html" should open "other.html" with it's iframe "parented_2.html" which has scrolled to middle of the iframe.
Do you mean the link that is outside the iframe (top-left of page)?
===
Arie.
M rosi
02-26-2011, 03:14 PM
Yes, the link should be lie outside from the iframe.
molendijk
02-26-2011, 10:53 PM
Hi M rosi,
What you want is not possible, I'm afraid. As I said, you cannot go from an iframed page (contained in a main page MP1) to an anchor in another iframed page (contained in another main page MP2) unless you have the 2 iframed pages encompassed by one and the same main page (other than MP1 and MP2).
Without the 'anchor requirement', there should be a solution, though.
===
Arie.
M rosi
02-27-2011, 04:34 AM
Thank you very much molendijk. :)

is it impossible! :confused:
but still i'm trying, hoping that it can be achieve.
can't we get some assistance from javascript ??
coothead
02-27-2011, 01:44 PM
This problem appears to have been resolved here...
http://www.dynamicdrive.com/forums/showthread.php?t=61069
coothead