Anchor links in iframe

[SACherub]

I know this question has been asked - but I never got a result that helped me.

Top = frame
Side = frame
content page = frame with iframe in it.

If you click on any of the links on the side they go to a page - in that page is an iframe which calls another page ... seems a long drawn out way to to do it - but I did that because the heading / colour strip at the top of the pages must not move when you scroll the text and it seemed easier to load a page and iframe than a frameset - although the same number of pages would exist - so maybe it would have been the same.

NOW - if you click on any links in 4 of the sections they need to link to anchor links within the iframe src page - but they don't ...

can anyone offer any advise or tell me how to do this?

Hope it makes sense

THANKS!

[BlobFisk]

Welcome to WebmasterWorld, SACherub!

Just to clarify what you are asking, you are looking for a way for links in (say) the top frame to link to a named anchor in the content frame?

¦--------------¦ 
¦....Top.......¦ 
---------------¦ 
¦S¦------------¦ 
¦i¦..¦iFrame¦..¦ 
¦d¦------------¦ 
¦e¦............¦ 
¦--------------¦ 

Is your preference to use the target attribute or to use JavaScript? Have you tried merely using the frame name in the target attribute?

[SACherub]

Hi BlobFlisk - thanks for the welcome and for getting back to me :) :)

Yes, have tried the target but that doesn't work.

The diagram you "drew" looks pretty much what I am using. The content frame (on the right is fine) ... But that has the iframe in it ... when you click on any menu on the side the entire content frame changes and so does the iframe src page. The reason I did that is that the content page has a heading that also changes (but must never scroll).

Some pages in the iframe src page have links and those links need to link to anchors in another iframe src page - but then the whole content page and iframe src page have to change, and the page needs to go down to the anchor ....

Sounds quite confusing

[BlobFisk]

Looks like we may have to use JavaScript:

You need to use document.location.href to manipulate the location.

To access a parent frame using JavaScript it is parent.document.

Now, to access the iFrame (in the content Frame) from (say) the left Frame we need to go up to the parent, down into the content frame and down again into the iFrame. So,

parent.content_frame_name.documentgetElementById('iFrameID').document.location.href = 'iFrameURL.html#namedAnchor";

Will link to the named anchor within the iFrame.

You can also use only the frame names:

parent.content_frame_name.iFrame_name.document.location.href = 'iFrameURL.html#namedAnchor";

HTH

- Added document.

[edited by: BlobFisk at 1:00 pm (utc) on June 15, 2004]

[SACherub]

Please excuse my ignorance ....

Is this the way I must write the whole link? well probably not because I get an error :)

<a href="javascript:parent.main.iFrame.document.location.href='1chapf7.htm#DIAG1A";>LINK</a>

The names above are correct (frame, content, iframe etc) ....

[BlobFisk]

Try adding an ID to the iFrame and use this:

parent.content_frame_name.documentgetElementById('iFrameID').document.location.href = 'iFrameURL.html#namedAnchor";

See if this works. I'm doing this on the fly without testing, so mea culpa for any errors!

[SACherub]

Still not working but I am sure it's to do with the way I am putting the javascript in - so I will keep on trying :)

[BlobFisk]

What error is being thrown?

<added>I've just noticed that you are missing the trailing single quote ( ') from your javascript anchor call - that could well be the source of your problems...

[SACherub]

here do I put the trailing (') - I really must be thick

if I write

<a href="javascript:parent.main.iFrame.document.location.href='1chapf7.htm#DIAG1A'";>LINK</a>

I get "parent.main.iFrame.document is Null or not an object"

If I write

<a class="textlink" href="javascript:parent.main.documentgetElementById('5').document.location.href = '1chapf7.htm#DIAG1A'";>LINK</a>

I get "object doesn't support this property or method"

I am sorry I am not getting this :( but I really, really do appreciate your time and help!

[DrDoc]

A couple things:

1)

main

is a JavaScript keyword. Rename the frame
2)

iframe

is also a keyword. Rename the iframe
3) you need a dot between

document

and

getElementById

. Right now it says

documentgetElementById

4) IDs should not begin with a number

:)

[SACherub]

Mmmm .... this is just not working :(

Made all the changes you suggested - using both ways to write it ....

Opens up a new window which shows Page Not Found

:(

[BlobFisk]

You also have your semicolon (;) outside the double quotes, this should be between the single quote and the double quotes...

[SACherub]

:( still not working

Here's what I have written

<a class="textlink" href="javascript:parent.contentframe.document.getElementById('contiframe').document.location.href='1chapf7.htm#DIAG1A';">Diagram 1A: IDP Structures</a>

THEN

<a class="textlink" href="javascript:parent.contentframe.contiframe.document.location.href='1chapf7.htm#DIAG1A';">

Both open new window - and say page not found

Have made sure I have named frames and iframe what I have called them above

[SACherub]

Correction - says page cannot be displayed (not 'not found"

[isitreal]

Do your iframe pages have multiple content pages in the iframe, or is it just a single content page? Either way if you don't want to go the javascript route, which means your links won't work for x percent of users, this seems like an ideal time to use server side scripting with query strings. If you have php I can show you how to do that if you want.

[SACherub]

not sure what you mean by multiple content pages in the iframe - but there are about 50 pages with their own iframe and each iframe has it's own content page.

can't use server side scripting because this is going to be a CD which will be handed out to various people