Embedding Sound with Flash, Part IV: Native JavaScript: Sharing SWFs Among Web Site Pages - Doc JavaScript
Embedding Sound with Flash, Part IV: Native JavaScript
Sharing SWFs Among Web Site Pages
When you base your Web site's sound on an invisible frame, only the visible frame changes. You display your Web site's pages in the visible frame. In this way, we have a site that includes two frames: one fixed frame with the embedded SWFs, and one frame that hosts the regular site's Web pages. When we jump from this frame to another Web page, the new page positions itself in the same frame under the same frameset. All of the Web site's pages access the same Flash sound object in the invisible frame. In this way, you maintain the sound embedding in a single file, serving all of the Web site's pages.
Let's see these frames in a demo. Our invisible frame is called swf
.
Click here to see a page with two frames, one invisible and one visible. The FRAMESET
file is mostly straightforward:
<HTML> <HEAD> <TITLE>Flash sound with Frames</title> </HEAD> <FRAMESET FRAMESPACING="0" BORDER="false" ROWS="1,*" FRAMEBORDER="0"> <FRAME NAME="swf" SCROLLING="no" NORESIZE TARGET="main" SRC="7b.html" MARGINWIDTH="1" MARGINHEIGHT="1"> <FRAME NAME="main" src="7c.html" scrolling="auto"> <NOFRAMES> <BODY> <P>This page uses frames, but your browser doesn't support them.</P> </BODY> </NOFRAMES> </FRAMESET> </HTML>
This is the code for the invisible frame (7b.html):
<HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript" SRC="flashsoundcheck.js"> </SCRIPT> <SCRIPT LANGUAGE="JavaScript"> <!-- if (window == top) top.location.href = "7a.html"; // --> </SCRIPT> <TITLE>INVISIBLE FRAME</TITLE> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript"> Flash_embedSWF("animalsounds.swf"); </SCRIPT> </BODY> </HTML>
Notice that all sound operations are included in the JavaScript code. Functions are defined in the external script flashsoundcheck.js
. This is the code for the visible frame (7c.html):
<HTML> <HEAD> <TITLE>VISIBLE FRAME</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- if (window == top) top.location.href = "7a.html"; // --> </SCRIPT> </HEAD> <BODY> <P>Hello World. This is 7c.html.</P> | <A href="javascript://" onclick="top.swf.sonified_flash(10); return false">Dog Barking</a> | <A href="javascript://" onclick="top.swf.sonified_flash(30); return false">Frog Ribbet</a> | <A href="javascript://" onclick="top.swf.sonified_flash(60); return false">Horse Whinny</a> | <A href="javascript://" onclick="top.swf.sonified_flash(80); return false">Cat meow</a> | </BODY> </HTML>
We have to make sure the user does not load one of the frames by itself, without the parent frameset page. You can force the frames by adding the following code to each and every frame's HEAD
section:
if (window == top) top.location.href = "7a.html";
Next: A Final Word
Produced by Yehuda Shiran and Tomer Shiran
All Rights Reserved. Legal Notices.
Created: May 21, 2001
Revised: May 21, 2001
URL: https://www.webreference.com/js/column84/7.html