...

View Full Version : Trouble with frames



VWBeetle69
06-05-2007, 07:56 PM
Ok, I found how to make two frames change with one button. That wasn't too bad. Here's the tricky part. How do I do that same function with more than one button in my nav bar? :confused: Here is what I have so far.


<script type="text/javascript">
<!--
var images = [ // list images
["../Images/TOC/Home1.bmp","../Images/TOC/Home2.bmp","../Images/TOC/Home3.bmp"], // link 1
["../Images/TOC/Ensembles1.bmp","../Images/TOC/Ensembles2.bmp","../Images/TOC/Ensembles3.bmp"], // link 2
["../Images/TOC/Directors1.bmp","../Images/TOC/Directors2.bmp","../Images/TOC/Directors3.bmp"], // link 3
["../Images/TOC/Calendar1.bmp","../Images/TOC/Calendar2.bmp","../Images/TOC/Calendar3.bmp"], //link 4
["../Images/TOC/RS1.bmp","../Images/TOC/RS2.bmp","../Images/TOC/RS3.bmp"], //link 5
["../Images/TOC/NMS1.bmp","../Images/TOC/NMS2.bmp","../Images/TOC/NMS3.bmp"], //link 6
["../Images/TOC/Resources1.bmp","../Images/TOC/Resources2.bmp","../Images/TOC/Resources3.bmp"], //link 7
["../Images/TOC/History1.bmp","../Images/TOC/History2.bmp","../Images/TOC/History3.bmp"], //link 8
["../Images/TOC/Boosters1.bmp","../Images/TOC/Boosters2.bmp","../Images/TOC/Boosters3.bmp"] //link 9
]

var preloadImages=new Array() // preloads images
for(var i=0;i<images.length;i++) {
preloadImages[i]=new Array()
for(var j=0;j<images[i].length;j++){
preloadImages[i][j]=new Image()
preloadImages[i][j].src=images[i]
}
}

lastN = ""
lastPic=""

function mOver(obj,num){
if(lastN != obj.name){
document.images[obj.name].src = images[num][1]
}
}

function mOut(obj,num){
if(lastN != obj.name){
document.images[obj.name].src = images[num][0]
}
}

function mActive(obj,num){
document.images[obj.name].src = images[num][2]
if (lastN != "" && lastN != obj.name){
document.images[lastN].src = lastPic
}
lastN = obj.name
lastPic=images[num][0]
}

// -->
</script>
<SCRIPT language="JavaScript">
<!----hide
function change2()
{
parent.TOC.location="../TOCpages/TOC-ensembles.html";
parent.Main.location="../Ensembles.html";
}
//------>
</SCRIPT>

<body>
<a href="../Home.html" target="Main"><img src="../Images/TOC/Home1.bmp" border="0"name="img0" onmouseover="mOver(this,0)" onmouseout="mOut(this,0)" onclick="mActive(this,0)"></a><br>
<a href="javascript:change2()"><img src="../Images/TOC/Ensembles1.bmp" border="0" name="img1" onmouseover="mOver(this,1)" onmouseout="mOut(this,1)" onclick="mActive(this,1)"></a><br>
<a href="../Directors.html" target="Main"><img src="../Images/TOC/Directors1.bmp" border="0" name="img2" onmouseover="mOver(this,2)" onmouseout="mOut(this,2)" onclick="mActive(this,2)"></a><br>
<a href="../Calendar.html" target="Main"><img src="../Images/TOC/Calendar1.bmp" border="0" name="img3" onmouseover="mOver(this,3)" onmouseout="mOut(this,3)" onclick="mActive(this,3)"></a><br>
<a href="../RS.html" target="Main"><img src="../Images/TOC/RS1.bmp" border="0" name="img4" onmouseover="mOver(this,4)" onmouseout="mOut(this,4)" onclick="mActive(this,4)"></a><br>
<a href="../NMS.html" target="Main"><img src="../Images/TOC/NMS1.bmp" border="0" name="img5" onmouseover="mOver(this,5)" onmouseout="mOut(this,5)" onclick="mActive(this,5)"></a><br>
<a href="../Resources.html" target="Main"><img src="../Images/TOC/Resources1.bmp" border="0" name="img6" onmouseover="mOver(this,6)" onmouseout="mOut(this,6)" onclick="mActive(this,6)"></a><br>
<a href="../History.html" target="Main"><img src="../Images/TOC/History1.bmp" border="0" name="img7" onmouseover="mOver(this,7)" onmouseout="mOut(this,7)" onclick="mActive(this,7)"></a><br>
<a href="../Boosters.html" target="Main"><img src="../Images/TOC/Boosters1.bmp" border="0" name="img8" onmouseover="mOver(this,8)" onmouseout="mOut(this,8)" onclick="mActive(this,8)"></a><br>
<br>

What do I need to add to the script to help it identify which button was selected and which two pages to load in the correct frames?

Let's say, when I click my Resources button, my TOC frame changes to TOC-resources.html and my Main frame changes to resources.html. Any suggestions would be great.

glenngv
06-05-2007, 08:02 PM
A function is not necessary.

<a href="../TOCpages/TOC-ensembles.html" target="TOC" onclick="window.open('../Ensembles.html', 'Main');"><img src="../Images/TOC/Ensembles1.bmp" border="0" name="img1" onmouseover="mOver(this,1)" onmouseout="mOut(this,1)" onclick="mActive(this,1)"></a>

VWBeetle69
06-05-2007, 09:36 PM
WOW, fantastic. Thanks so much glenn.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum