• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL

Chapter 4. Frames, Frames, and More Frames > Forcing a Site into a Frame

Forcing a Site into a Frame

If you have a large site, with numerous pages that you want inside a frame, the method described on the preceding page can easily become unwieldy. Here's a method that works better for larger sites. Script 4.5 (detailed below) shows the frameset, Script 4.6 shows the left-hand navigation bar, and Scripts 4.7 and 4.8 show the small amount of JavaScript you have to add to every page on your site. Figure 4.6 shows your page by itself, and Figure 4.7 shows how you intended your site to look.

Figure 4.6. Here's our page outside the frame.

Figure 4.7. But here's how we really want it to look.

Script 4.5. The frameset page understands a passed content page location.

Script 4.6. The left-hand navigation bar should always show.

Script 4.7. One page is passed to the frameset…

To force a site into a frame:

								linkURL = "frame3a.html"

Set linkURL here to be the default page that will appear in the content frame, just in case you're loading the frameset without a reference to a content page.

								if (parent.document.URL) {

Not every JavaScript-capable browser understands the URL object. If this browser doesn't, you want to skip the following steps (through step 5), and you do that by enclosing the steps within the if statement.

								callingURL = parent.document.URL

If the browser does understand the URL object, you want to store that value in the callingURL variable.

								if (callingURL.indexOf('?') != -1) {

You're going to pass the name of the page you want in the content frame to the frameset page. This is done by taking the name of the page that you want to load (the frameset page) and appending to it a question mark and then the name of the desired content page. This step checks to see if there's a question mark in callingURL. If so, you want to do the next step.

								linkURL = callingURL.substring (callingURL.indexOf('?')+1, callingURL.length)


Here you take the URL and select just the part that follows the question mark. The indexOf() method gives the location of the question mark, and the length property gives us the length of callingURL. The substring() method returns just the part of callingURL that you want: from 1 character after the question mark to the end of the URL.

								document.writeln('<FRAMESET COLS= "30%,70%">')
								document.writeln('<FRAME SRC= "left3.html" NAME="left">')
								document.writeln('<FRAME SRC= "' + linkURL + '" NAME="content">')

This part of the code writes out the frameset on the fly. If the browser understood the URL object and a URL was passed in with a question mark, the content frame gets the desired URL. Otherwise, the page gets the default content frame that was defined in linkURL in step 1

								self.location.replace("frameset3. html?frame3a.html")

On the page that you want to be in a frame ( Script 4.7 ), this code forces the frameset page to load. Replace self.location with the name of the frameset page followed by a question mark and the name of the page that you want in the content frame.

Script 4.8. And another is passed, in the same manner.


The document.URL object only exists for JavaScript 1.1 browsers and higher. If you need to support earlier browser versions, keep in mind that they'll always get the default page.


For simplicity's sake, the frameset page shown in Script 4.5 doesn't handle old non-JavaScript browsers or browsers that don't support frames. Yours, of course, should, by doing a browser detection check (see Chapter 2).


Why is there a backslash ("\") before the slash ("/") in step 6? According to the HTML standards, the browser may interpret the beginning of a closing tag ("</") inside the document.write() as the end of the line. The backslash "escapes" the slash, allowing us to write out HTML without the chance of causing an error.


If you're running this script with IE from your local hard drive, you may notice that it's not working. This is due to an IE bug, and as soon as you upload the file to a server and run it from there, it should work fine.

Script 4.9. This frameset loads our desired pages.

Script 4.10. Use this script to set up the content from the navigation frame.

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint