okay, I wrote what I hope is an easy to follow step-by-step tutorial, give it a try, the files are attached at the bottom:
Tutorial by [Legoman]
Using robert penner’s back button technique with loadMovie
Components:
–Main flash movie + html page.
–external movies to be loaded
–frameset: html page with two frames, one to show your movie and a hidden one to track the pages you are visiting.
–a separate, content-free html page for each external movie.
Main swf:
–create the buttons for your navigation
–make a new movie-clip but leave it blank.
–place one instance of the blank mc on the stage where you want the top left hand side of your content to load. Give this the instance name “content”.
–place another instance of the blank mc on the screen, but not in the visible stage area, give this the instance name “navigator”.
–double click on the “navigator” instance to edit it. on the first frame place this code:
function checkPage() {
newPage = _root.page;
if (oldPage != newPage) {
_root.content.loadMovie(newPage+".swf");
}
oldPage = newPage;
}
This gets a variable from the main timeline which represents the page, checks if it needs to go to a new page and reacts accordingly.
NOTE: by default, flash will automatically add this code to your “content” instance. don’t worry about this, it won’t do anything.
–go back to the main timeline, select the “navigator” instance(don’t double click!) and add this code:
onClipEvent (enterFrame) {
this.checkPage();
}
This will constantly call the function we just created to see if a new page is required.
–now we need to add the code for the buttons. note that the buttons do two things, 1. call a content-free html page into an invisble frame to track the history(more later)
and 2. set a variable called page which is used in the function above to load in the correct external swf.
example button code:
on (release) {
getURL (“1.html”, “historyframe”);
_root.page = 1;
}
you will notice in the example files I have named my pages 1, 2, 3, 4, 5. of course, you don’t need to stick to this.
if you wish your page to be called “portfolio”, just change 1.html to portfolio.html and _root.page=1; to _root.page=portfolio; .
continue in similar fashion for your other buttons.
–now make sure you’ve saved your file and publish both an html page and the swf.
–we need to edit the html a bit. open it in notepad to view the source.
–between the < HEAD > < /HEAD > tags add this code:
<script language="JavaScript">
function setPage(newPage) {
if (window.document.mymovie) {
window.document.mymovie.SetVariable("page", newPage);
}
}
</script>
this communicates with the flash movie to set the variable ‘page’ .
–now find the < OBJECT tag and make the end look like this WIDTH=XXX HEIGHT=XXX id=“mymovie” >
leave width/height etc. the same but add: id=“mymovie” .
–now go to the < EMBED tag and do similar, after the width/height add : NAME=mymovie swLiveConnect=true .
–save the file, and we’re done with this part. at last.
External movies:
not too much to say here.
–make your external movies with whatever content you wish but make sure of these two things:
—your page names must correspond with the buttons you made earlier, eg. if the buttons referred to 1.html, 2.html. etc. name your swfs 1.swf, 2.swf, etc.
If your buttons referred to portfolio.html, news.html or whatever call the movies portfolio.swf etc.
–Also ONLY publish the swfs NOT the html files.
Frameset:
–This is the page you will view, two frames, one with your flash html file and another invisible one to track your history, it should look something like this:
<html>
<head>
<title>Title of my flash page</title>
</head>
<frameset rows="*,0" frameborder="NO" border="0" framespacing="0">
<frame src="myflashpage.html" name="flashframe" frameborder="NO">
<frame src="1.html" name="historyframe" frameborder="NO"></frameset>
<noframes><body bgcolor="#FFFFFF">
</body></noframes>
</html>
–here “myflashpage.html” should be changed to whatever the html page containing your flash file is.
–“1.html” should coincide with whatever page you want to appear first.
–save this file as “frameset.html” or similar.
history tracking pages:
–you should have a separate page for each external swf you want to store in the history. They should follow this format:
<html>
<script language="JavaScript">
parent.flashframe.setPage(pagename);
</script>
</html>
Filename=“pagename.html”
–whether you used 1, 2, 3, etc. or portfolio, services, etc. pagename should be replaced by the name of each page.
now make sure all of your files are in the same folder and open “frameset.html” with any luck you’ve just enabled the back button in your flash website.
[Legoman]
sorry man!
