...

View Full Version : Linking to iframes and change content



warfish70
08-20-2010, 01:41 PM
Hi all

I'm rather new to java scripting and trying to get this done for over a week now.

I'm building a complete new site (not online yet) which is done for 99,9%

The site consists of:

Index - No frames - Just an entrance of the site with links
main menu
Section1 - 1 iframe ("iframe1") - default src=iframe1defaultsection1content
main menu submenu section1
Section2 - 2 iframes ("iframe1","iframe2") - default src = iframe1defaultsection2content - frame2 contains images that change
main menu submenu section2
Section3 - 1 iframe ("iframe1") - default src=iframe1defaultsection3content
main menu submenu section3
Section4 - 1 iframe ("iframe1") - default src=iframe1defaultsection4content
main menu submenu section4
Contact - 1 iframe ("iframe1") - default src=iframe1defaultcontactcontent
main menu submenu contact

The main menu is plain html that is on every page
I use javascripts to make a loadIframeFunction load content into the iframes



<head>
<script type="text/javascript>
var iframeids=["iFrame1"]

var iframehide="yes"

function loadintoIframe(iframeid, url){
if (document.getElementById)
document.getElementById(iframeid).src=url
}
</script>
</head>
<body>

<iframe id="iframe1" src="iframesection1start.html" width="644px" height="385px" style="position:absolute; left:505px; top:275px; z-index:73 scrolling="yes" marginwidth="0" marginheight="0" frameborder="0"></iframe>

<a href="javascript:loadintoIframe('iframe1', 'iframecontent.html')" title="content">Content</a>

</body>


Everything works, but 1 thing.

i can't get the links in the index page link to the specific section page AND change the default src content

can anybody assist me pls?

warfish70
08-20-2010, 04:08 PM
Thanks to MRJ i found the solution for my problem.

i combined his code with the one i already had.

My javascript on the section pages looks like this:




//Input the IDs of the IFRAMES you wish
//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"

function loadIframe(){
if (location.search.length > 0){
url = unescape(location.search.substring(1))

window.frames["iframe1"].location=url
}
}

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

onload=loadIframe, loadintoIframe


My section pages look like this: - You MUST leave the src property empty! and keep in mind that javascript is case sensitive!



<body>
<iframe name="iframe1"id="iframe1" src="" width="644px" height="385px" style="position:absolute; left:505px; top:275px; z-index:73 scrolling="yes" marginwidth="0" marginheight="0" frameborder="0"></iframe>
</body>


now i can call the right content in the right page from the links on the index page



<a href="sectionx.html?iframecontenty.html">content y</a>


and use the java loadintoIframe script via the submenus



<a href="javascript:loadintoIframe('iframe1', 'iframecontentz.html')"> content z</a>


The last thing i had to do was to alter the code in the html main menu to load the default section page - this is easy!



<a href="sectionx.html?iframesectionxstart.html">section x</a>


Hope this can help others too that have problems with inline frames :D:D



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum