change background colour of another frame

Bazzio · #1 (**permalink**) 08-15-05, 04:09 PM

I was wondeirng if there was anyway of changing the colour of another frame when you click on a link/image.

i have a music player in my left frame so when you click to enter the site, music plays throughout, but i need to change the background colour of that frame when i move from the splash page to the mainsite

Hope someone can help!!!
Thanks!

TwoD · #2 (**permalink**) 08-15-05, 05:51 PM

To make a reference to another frame using JavaScript you use the frames collection and the window object like this:

window.parent.frames['other_frame_name' or other_frame_id_no].document.body.style.backgroundColor="blue"

Bazzio · #3 (**permalink**) 08-15-05, 06:00 PM

sorry, but im not so experienced with javascript
how would i implement that so when i click the intro pic, it went to the main news.php site and changed the background colour of the left frame to oragne.

THANKS!

TwoD · #4 (**permalink**) 08-15-05, 06:08 PM

I don't know exactly how to do it since I don't know what your frameset looks like.

For the image use an onclick event like this: <img src="pic.jpg" onClick="window.parent.frames[0].document.body.backgroundColor='orange';">
I'm just guessing that you have two frames and the left frame has id 0.

Bazzio · #5 (**permalink**) 08-15-05, 06:17 PM

my left frame is called leftFrame

how do i give it an id number?

TwoD · #6 (**permalink**) 08-15-05, 06:20 PM

Each frame is automatically given an id number. Which one depends on the order in which they appear in the source, starting at 0.
You can either use the id number or the frame name when referring to a fram in the frames collection, like this:
frames['leftFrame'] is the same as frames[0] if the left frame comes first in the frameset. (which would be logical if you only have two frames)

Bazzio · #7 (**permalink**) 08-15-05, 06:26 PM

hmmm cant seem to get it to work

TwoD · #8 (**permalink**) 08-15-05, 06:35 PM

This would be easier if you posted a link to your page or posted the sourcecode for the frameset page and the two other pages in question.

Bazzio · #9 (**permalink**) 08-15-05, 06:40 PM

LEFT FRAME:
<body><table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="middle"><object classid="clsid

27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="20" height="15">
<param name="movie" value="sideplayermusic.swf">
<param name=quality value=high>
<param name="wmode" value="transparent">
<embed src="sideplayermusic.swf" width="20" height="15" quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" wmode="transparent"></embed>
</object></td>
</tr>
</table>
</body>

MAIN FRAME:
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center"><a href="news.php" "><img src="rickstarnew.gif" onClick="window.parent.frames[0].document.body.backgroundColor='orange'; width="800" height="525" border="0"></a></td>
</tr>
</table> </td>
</tr>
</table>
</body>

FRAMESET:
<frameset cols="20,*" frameborder="NO" border="0" framespacing="0">
<frame src="leftblack.htm" name="leftFrame" scrolling="NO" noresize>
<frame src="indexmid.html" name="mainFrame">
</frameset>
<noframes><body>
</body></noframes>

TwoD · #10 (**permalink**) 08-15-05, 07:04 PM

Sorry, looks like I tricked you, it should be body.style.backgroundColor

However, you seem to have a double quotation mark too much in the href attribute and you forgot one after the onClick event..
<td align="center"><a href="news.php"><img src="rickstarnew.gif" onClick="window.parent.frames[0].document.body.style.backgroundColor='orange';" width="800" height="525" border="0"></a></td>