Call the Iframe from external page?

**psilos** · 04-13-2007, 07:59 AM

1) Script Title: Iframe SSI script II

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...iframessi2.htm

3) Describe problem:

Hello everyone,

I have implemented the iframe effect with your script in page "products.html" for example.So i load in this page iframes "products01.html", "products02.html", ..etc

What i want to achieve is to load the specific "product02.html"from my index.html page where i have a general menu.
How can i achieve this??

Normally i would call :

Code:

<a href="javascript:loadintoIframe('myframe', 'products/product02.html')">

Thanx in advance..

**mburt** · 04-13-2007, 01:32 PM

Put this in the <head> section of your page:

Code:

<script type="text/javascript">
window.onload = function() {
loadintoIframe('myframe', 'products/product02.html');
}
</script>

**psilos** · 04-13-2007, 02:05 PM

Well i don't want to load always the same page...

i have a menu, so i want to pass as parameter to the javascript the specific page each time..

Hope u understand what i mean..

**mburt** · 04-13-2007, 02:08 PM

I'm not sure I fully understand what you mean, but I'll give it a shot:

Code:

function loadpg(frame, location) {
loadintoIframe(frame,location);
}

And use it with the script above. But this honestly, has no point considering you could use the default loadintoIframe(); function.

**Veronica** · 04-13-2007, 02:27 PM

Are you trying to put links on your home page that would link to an iframe page but with different content loaded into the iframe page depending on the link?

You can do that with javascript, but I'm not sure it will work with the resizing script.

The easiest way (unless you have thousands of product01.html, product02.htmls etc) would be to simply create different pages, using the same script but with different content loaded into the iframe, and then set up links to those pages.

**psilos** · 04-13-2007, 02:29 PM

I'll try to explain..

I have an index.html as first page. In this i have a drop-down menu in order to select products.

Then i have a products.html page.
In this i have an iframe with id="myframe".
In the iframe i load the pages product01.html, product02.html, ...etc.

What i want to achieve is :

Select from index page a product
Load products.html
And load inside products.html in the iframe the product selected

Thanx for your help..

**psilos** · 04-13-2007, 02:37 PM

Are you trying to put links on your home page that would link to an iframe page but with different content loaded into the iframe page depending on the link?

That's exactly what i mean Veronica..

But i don't agree with your solution..
I use iframes in order not to have loading different pages each time..but refresh only a part of it..
So, if i make direct links to pages i earn nothing..

**Veronica** · 04-13-2007, 02:47 PM

OK, try this.

In products.html, add this to the head section NOTE-replace myframe with the id you have given the frame, but keep it in quotes:

Code:

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

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

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

onload=loadIframe
//-->
</script>

Then on your home page, write the links like this

Code:

<a href="products.html?product01.html">Product 1</a>

This may cause problems with the resizing script in some browsers.

**jscheuer1** · 04-13-2007, 02:58 PM

First of all, I am not all that thrilled with the Iframe SSI script II script because it doesn't work in many browsers and cannot work even in IE and FF in certain layouts. And, in any browser without javascript enabled, shows no iframe. But, if you are happy with it, you can pass a parameter as a query with an ordinary link:

Code:

<a href="index.html?product=02">Link Text or Image</a>

Then, add this function at the top of the script:

Code:

function get(key_str) {
var query = window.location.search.substr(1);
var pairs = query.split("&");
for(var i = 0; i < pairs.length; i++) {
var pair = pairs[i].split("=");
if(unescape(pair[0]) == key_str)
return unescape(pair[1]);
}
return null;
}

Add this code to function resizeCaller() of the script:

Code:

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"
}
}
if(get('product'))
loadintoIframe('myframe', 'products/product'+get('product')+'.html')
}

Or, instead of modifying resizeCaller(), you could replace this (your version of it):

Code:

<iframe id="myframe" src="externalpage.htm" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0" style="overflow:visible; width:100%; display:none"></iframe>

with something like this:

Code:

<script type="text/javascript">
var the_product_page=get('product')? "products/product'+get('product')+"html" : "products.html";
document.write('<iframe id="myframe" src="'+the_product_page+'" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0" style="overflow:visible; width:100%; display:none"></iframe>');
</script>

This would load the chosen content as the page loads as opposed to after the page has loaded.

**Veronica** · 04-13-2007, 03:26 PM

I agree with John about the re-sizing script's "buggy-ness"
You should also make sure that your products.html page has noframe content that brings in an iframe with good old-fashioned set heights and widths, and calls in a gateway page with links to ALL your product pages. It may not look pretty, but if you're using this to make money, it's better than having potential customers seeing a blank page if they have javascript turned off.

Thread: Call the Iframe from external page?

Thread Tools

Search Thread

Call the Iframe from external page?

Bookmarks

Bookmarks

Posting Permissions