The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> iFrame assistance pls. help, How to link to iFrames.
warfish70
post Aug 14 2010, 10:52 PM
Post #1





Group: Members
Posts: 1
Joined: 14-August 10
Member No.: 12,504



Hi folks. I'm kinda new to HTML/ Javascript programming and I have a bit of a problem.

I have a site with multiple sections. Each section uses an iframe.
Every section has an src=iframesectionstart. Every topic replaces the src=iframesectionstart through a javaloadscript; this works like clockwork. smile.gif

However.

I also have an index page with no iframes. From that index page i want to link to different sections (html pages) AND link to the proper iframe as well. (replace the src=iframesectionstart)

i can't get this working properly! blink.gif mad.gif huh.gif wacko.gif

pls assist me with this.


This is the code i use:

The java script:




/***********************************************
* IFrame SSI script II- Dynamic Drive DHTML code library (http://www.dynamicdrive.com)
* Visit DynamicDrive.com for hundreds of original DHTML scripts
* This notice must stay intact for legal use
***********************************************/

//Input the IDs of the IFRAMES you wish to dynamically resize to match its content height:
//Separate each ID with a comma. Examples: ["myframe1", "myframe2"] or ["myframe"] or [] for none:
var iframeids=["iFrame1"]



//Should script hide iframe from browsers that don't support this script (non IE5+/NS6+ browsers. Recommended):
var iframehide="yes"

var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 16 : 0 //extra height in px to add to iframe in FireFox 1.0+ browsers

function resizeCaller() {
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++){
if (document.getElementById)
resizeIframe(iframeids[i])
//reveal iframe for lower end browsers? (see var above):
if ((document.all || document.getElementById) && iframehide=="no"){
var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
tempobj.style.display="block"
}
}
}

function resizeIframe(frameid){
var currentfr=document.getElementById(frameid)
if (currentfr && !window.opera){
currentfr.style.display="block"
if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) //ns6 syntax
currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight;
else if (currentfr.Document && currentfr.Document.body.scrollHeight) //ie5+ syntax
currentfr.height = currentfr.Document.body.scrollHeight;
if (currentfr.addEventListener)
currentfr.addEventListener("load", readjustIframe, true)
else if (currentfr.attachEvent){
currentfr.detachEvent("onload", readjustIframe) // Bug fix line
currentfr.attachEvent("onload", readjustIframe)
}
}
}

function readjustIframe(loadevt) {
var crossevt=(window.event)? event : loadevt
var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement
if (iframeroot)
resizeIframe(iframeroot.id);
}

function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}

if (window.addEventListener)
window.addEventListener("load", resizeCaller, false)
else if (window.attachEvent)
window.attachEvent("onload", resizeCaller)
else
window.onload=resizeCaller


/* This script and many more are available free online at
The JavaScript Source :: http://javascript.internet.com
Created by: James Nisbet (morBandit) :: http://www.bandit.co.nz/ */

window.onload = function() {
document.onselectstart = function() {return false;} // ie
document.onmousedown = function() {return false;} // mozilla
}


/* You can attach the events to any element. In the following example
I'll disable selecting text in an element with the id 'content'. */

window.onload = function() {
var element = document.getElementById('content');
element.onselectstart = function () { return false; } // ie
element.onmousedown = function () { return false; } // mozilla
}



The placing of the iframe in the <body> of the different sections (html pages)

<iframe id="iFrame1" src="iframebackstartdefault.html" width="800px" height="400px" style="position:absolute; left:200px; top:100px; z-index:73 scrolling="yes" marginwidth="0" marginheight="0" frameborder="0"></iframe>


and in the <body> load the appropriate html page into iframe1

<div id="text30" style="position:absolute; overflow:hidden; left:159px; top:676px; width:185px; height:17px; z-index:54">
<a href="java script:loadintoIframe('iFrame1', 'iframebackwhatever.html')" title="whatever" class="style1"><div class="wpmd">
<div><font class="ws8"><B>Whatever!</a></B></font></div>
</div></div>



Now my question is:

How do i link directly from the index.html to the section.html with the whatever.hml loaded into iframe1? I can't find the code to do this.

Can anybody help me out pls?


Greetzzz,

Warfish

This post has been edited by warfish70: Aug 14 2010, 11:31 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Aug 14 2010, 11:38 PM
Post #2


WDG Member
********

Group: Root Admin
Posts: 8,172
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



I'm moving this to the client-side scripting forum.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Aug 14 2010, 11:39 PM
Post #3


WDG Member
********

Group: Root Admin
Posts: 8,172
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



Please see the FAQ entry
http://htmlhelp.com/faq/html/frames.html#frame-address

It talks about regular frames, but based on your description, you have the same problem with inline frames.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 4th September 2015 - 06:10 PM