Welcome to WebmasterWorld Guest from 3.227.233.55

Forum Moderators: open

Message Too Old, No Replies

using JS to create frame-life effects

     
2:58 pm on Sep 12, 2003 (gmt 0)

New User

10+ Year Member

joined:Sept 12, 2003
posts:2
votes: 0


I have heard that you can use javascript to create frame-like effects, more specifically, load another page into the current page. So, clicking on a link will open a page on the same window (obviously, the size and location must be prest). All this without using the HTML frame function. Can someone please tell me how? Thanks a lot.
4:22 pm on Sept 12, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member korkus2000 is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Mar 20, 2002
posts:3732
votes: 0


Welcome to the board BabyJenk5,

So you are asking how to do it without using an iframe?

4:27 pm on Sept 12, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Mar 15, 2002
posts:6807
votes: 0


No JavaScript is needed (and, in fact, it's better to avoid a pure JavaScript solutions since it will stop working completely if the user turns JavaScript off). Why not consider a CSS solution instead?

[webmasterworld.com...] (message 12)

5:03 pm on Sept 12, 2003 (gmt 0)

New User

10+ Year Member

joined:Sept 12, 2003
posts:2
votes: 0


thanks DrDoc, but what i'm looking for is, a page is divided into A and B. if i click on a link in A, a new page will load in B.

the link you provided gives the code where if i click on a link in A, a new page loads that overtakes both A and B.

I've seen a website where in the HEAD tag, the following is included:

<script type="text/javascript" src="load.js"></script>

and for the link in the body of the page, the following is used:

<a href="javascript:PageManager('load_page','news.html')">home</a>

now, there are no other javascript codes found anywhere else in the code of the page, so i'm assuming that "load.js" is an external file that manages the "pageManager" and the "load_page".

if there are ways to get the effect i want without using javascript, that'd be great too. whatever can be done, i'd be happy with. =)

12:54 pm on Sept 16, 2003 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:July 26, 2003
posts:881
votes: 0


Give this a shot...

 <style type="text/css">
.wrap {
position: absolute;
top: 4px;
right: 2px;
bottom: 2px;
left: 4px;
}
#nav {
width: 21.2%;
height: 99.5%;
float: left;
}
#main {
width: 78%;
height: 99.5%;
float: left;
}
iframe {
margin: 0;
border: none;
}
</style>

<script type="text/javascript">
<!--
var warn = "Your browser doesn't support or hasn't enabled iframes!<br />" +
"View the iframe content directly: ";
function loaded() {
document.getElementById("nav").src = "blah.htm";
document.getElementById("nav").innerHTML = warn + '<a href="blah.htm">Here</a>';
document.getElementById("main").src = "f1.htm";
document.getElementById("main").innerHTML = warn + '<a href="f1.htm">Here</a>';
}
function loadNav(uri) {
document.getElementById("nav").src = uri;
document.getElementById("nav").innerHTML = warn + "<a href=" + uri + ">Here</a>";
}
function loadMain(uri) {
document.getElementById("main").src = uri;
document.getElementById("main").innerHTML = warn + "<a href=" + uri + ">Here</a>";
}
window.onload = loaded;
//-->
</script>

...

<div class="wrap">
<iframe id="nav"></iframe>
<iframe id="main"></iframe>
</div>

Then you can call

parent.loadMain("http://somewhere.blah");
from a link in the nav "frame" to change the page displayed in the main "frame" (or the other way).

Hope that helps
Jordan

 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members