spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / javascript / column36


JavaScript and Frames, Part I (4)

Sr. Web Developer
mediabistro.com
US-NY-New York

Justtechjobs.com Post A Job | Post A Resume
Developer News
Microsoft Shows Off Silverlight 4, IE9 Plans
Metasploit Expands Vulnerability Test Framework
HyperCard Reborn?


Controlling Multiple Frames

One of the capabilities of frame sets is the ability to control multiple frames from a single frame. There are two basic ways to do it. The first one is a combination of an HREF and an event handler assignment:

<A HREF="frame4new.html" TARGET="bottomrow"
onClick="parent.frames[1].location.href = 'frame4new.html';
return true;">Multiple Load #1</A>

In this example, we first load frame4new.html (HREF="frame4new.html") at the bottom row frame (TARGET="bottomrow"). Then, we use the onClick event handler to load the file frame4new.html in frame no. 1:

onClick="parent.frames[1].location.href = 'frame4new.html';

The second approach is to include all operations in the HREF's javascript: URL:

<A HREF="javascript:void(parent.frames[1].location.href='frame4new.html');
void(parent.frames[2].location.href='frame4new.html');">Multiple Load #2</A>

Here we assign frame4new.html to both frame 1 and frame 2. Although this technique doesn't degrade as well as the first for non-javascript enabled browsers, it is more straight-forward. Familiar yourself with the javascript: URL and its usage. We have covered this subject in Column 34, for example. Remember to return void from you JavaScript statements, as explained in Column34. It's time to play with the frames now. Convince yourself that both methods work the same and as described above.

Here is frame1new.html:

<HTML>
<HEAD>
<TITLE>Frame 1</TITLE>
</HEAD>
<BODY>
Frame 1
<P>
<A HREF="frame4new.html" TARGET="bottomrow" onClick="parent.frames[1].
location.href = 'frame4new.html'; return true;">Multiple Load #1</A><BR>
  // (The above two lines should be joined as one line.
  // They have been split for formatting purposes.)
<A HREF="javascript:void(parent.frames[1].location.href='frame4new.html');
void(parent.frames[2].location.href='frame4new.html');">Multiple Load #2</A>
  // (The above two lines should be joined as one line.
  // They have been split for formatting purposes.)
</P>
</BODY>
</HTML>


http://www.internet.com

Produced by Yehuda Shiran and Tomer Shiran

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Rolling Out Your Own HTML Application Version Control · HTML 5: Client-side Storage · Working with Ajax Server Extensions
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Wi-Fi Product Watch, November 2009 · Chip Market Recovering From '08 Collapse · Low-Cost Tools to Kickstart Your New Business


Created: March 1, 1999
Revised: March 1, 1999

URL: http://www.webreference.com/js/column36/multiple.html