J
Jayson
Hi All,
I'm developing a website which will have a banner and control buttons
at the top of the page, which I want to always be visible. Each
button can be in 4 different states depending on whether it is the
current page, the mouse is hovering over it, it has been pressed, or
none of the above. I have all that done, but the problem I'm having
is with HTML frames. When I click the control button to switch pages,
instead of opening the new page in the lower frame, it opens a new
window, (or new tab in my case as I'm running IE7).
I have included the problematic pages below, and I think the issue has
something to do with which frame name I'm calling from the <a ref
target> in the AboutFixed and ServicesFixed pages, but I've tried both
the Fixed and Scroll frame names and get the same result. Is it even
possible to have 2 dynamic frames on the same page, because I think
that's where I'm falling down. I need to have 2 due to the changing
nature of the control buttons.
About.htm
<HTML>
<HEAD>
<TITLE>About</TITLE>
</HEAD>
<FRAMESET rows="183,*" frameborder="no" framespacing="0" border="0"
resize="no">
<FRAME name="AboutFixed" src="C:\Test\AboutFixed.htm">
<FRAME name="AboutScroll" src="C:\Test\AboutScroll.htm">
</FRAMESET>
</HTML>
AboutFixed.htm
<HTML>
<HEAD>
<STYLE type="text/css">
img {border: 0}
body {font-family: Arial; font-size: 8pt; color: white; background-
color: black}
</STYLE>
<TITLE>About</TITLE>
<img src="Banner.jpg">
</HEAD>
<SCRIPT language="VBScript">
Sub ServicesOver()
Document.Images(02).src = "C:\Test\Services\ServicesOver.jpg"
End Sub
Sub ServicesOut()
Document.Images(02).src = "C:\Test\Services\Services.jpg"
End Sub
Sub ServicesDown()
Document.Images(02).src = "C:\Test\Services\ServicesDown.jpg"
End sub
</SCRIPT>
<BODY>
<div style="position:absolute; top:102; left:50;">
<img src="C:\Test\About\AboutCurrent.jpg">
</div>
<div style="position:absolute; top:102; left:250;">
<a href="C:\Test\Services.htm" target="ServicesScroll"><img src="C:
\Test\Services\Services.jpg" onMouseOver="ServicesOver"
onMouseOut="ServicesOut" onMouseDown="ServicesDown"></a>
</div>
</BODY>
</HTML>
AboutScroll.htm
<HTML>
<HEAD>
<STYLE type="text/css">
p {font-family: Arial; font-size: 12pt; color: white}
img {border: 0}
body {background-color: black}
</STYLE>
</HEAD>
<BODY>
<p>This is some text from the About page.</p>
</BODY>
</HTML>
Services.htm
<HTML>
<FRAMESET rows="183,*" frameborder="no" framespacing="0" border="0"
resize="no">
<FRAME name="ServicesFixed" src="C:\Test\ServicesFixed.htm">
<FRAME name="ServicesScroll" src="C:\Test\ServicesScroll.htm">
</FRAMESET>
</HTML>
ServicesFixed.htm
<HTML>
<HEAD>
<STYLE type="text/css">
img {border: 0}
body {font-family: Arial; font-size: 8pt; color: white; background-
color: black}
</STYLE>
<TITLE>Services</TITLE>
<img src="Banner.jpg">
</HEAD>
<SCRIPT language="VBScript">
Sub AboutOver()
Document.Images(01).src = "C:\Test\About\AboutOver.jpg"
End Sub
Sub AboutOut()
Document.Images(01).src = "C:\Test\About\About.jpg"
End Sub
Sub AboutDown()
Document.Images(01).src = "C:\Test\About\AboutDown.jpg"
End sub
</SCRIPT>
<BODY>
<div style="position:absolute; top:102; left:50;">
<a href="C:\Test\About.htm" target="AboutFixed"><img src="C:\Test
\About\About.jpg" onMouseOver="AboutOver" onMouseOut="AboutOut"
onMouseDown="AboutDown"></a>
</div>
<div style="position:absolute; top:102; left:250;">
<img src="C:\Test\Services\ServicesCurrent.jpg">
</div>
</BODY>
</HTML>
ServicesScroll.htm
<HTML>
<HEAD>
<STYLE type="text/css">
p {font-family: Arial; font-size: 12pt; color: white}
img {border: 0}
body {background-color: black}
</STYLE>
</HEAD>
<BODY>
<p>This is some text from the Services page.</p>
</BODY>
</HTML>
I'm developing a website which will have a banner and control buttons
at the top of the page, which I want to always be visible. Each
button can be in 4 different states depending on whether it is the
current page, the mouse is hovering over it, it has been pressed, or
none of the above. I have all that done, but the problem I'm having
is with HTML frames. When I click the control button to switch pages,
instead of opening the new page in the lower frame, it opens a new
window, (or new tab in my case as I'm running IE7).
I have included the problematic pages below, and I think the issue has
something to do with which frame name I'm calling from the <a ref
target> in the AboutFixed and ServicesFixed pages, but I've tried both
the Fixed and Scroll frame names and get the same result. Is it even
possible to have 2 dynamic frames on the same page, because I think
that's where I'm falling down. I need to have 2 due to the changing
nature of the control buttons.
About.htm
<HTML>
<HEAD>
<TITLE>About</TITLE>
</HEAD>
<FRAMESET rows="183,*" frameborder="no" framespacing="0" border="0"
resize="no">
<FRAME name="AboutFixed" src="C:\Test\AboutFixed.htm">
<FRAME name="AboutScroll" src="C:\Test\AboutScroll.htm">
</FRAMESET>
</HTML>
AboutFixed.htm
<HTML>
<HEAD>
<STYLE type="text/css">
img {border: 0}
body {font-family: Arial; font-size: 8pt; color: white; background-
color: black}
</STYLE>
<TITLE>About</TITLE>
<img src="Banner.jpg">
</HEAD>
<SCRIPT language="VBScript">
Sub ServicesOver()
Document.Images(02).src = "C:\Test\Services\ServicesOver.jpg"
End Sub
Sub ServicesOut()
Document.Images(02).src = "C:\Test\Services\Services.jpg"
End Sub
Sub ServicesDown()
Document.Images(02).src = "C:\Test\Services\ServicesDown.jpg"
End sub
</SCRIPT>
<BODY>
<div style="position:absolute; top:102; left:50;">
<img src="C:\Test\About\AboutCurrent.jpg">
</div>
<div style="position:absolute; top:102; left:250;">
<a href="C:\Test\Services.htm" target="ServicesScroll"><img src="C:
\Test\Services\Services.jpg" onMouseOver="ServicesOver"
onMouseOut="ServicesOut" onMouseDown="ServicesDown"></a>
</div>
</BODY>
</HTML>
AboutScroll.htm
<HTML>
<HEAD>
<STYLE type="text/css">
p {font-family: Arial; font-size: 12pt; color: white}
img {border: 0}
body {background-color: black}
</STYLE>
</HEAD>
<BODY>
<p>This is some text from the About page.</p>
</BODY>
</HTML>
Services.htm
<HTML>
<FRAMESET rows="183,*" frameborder="no" framespacing="0" border="0"
resize="no">
<FRAME name="ServicesFixed" src="C:\Test\ServicesFixed.htm">
<FRAME name="ServicesScroll" src="C:\Test\ServicesScroll.htm">
</FRAMESET>
</HTML>
ServicesFixed.htm
<HTML>
<HEAD>
<STYLE type="text/css">
img {border: 0}
body {font-family: Arial; font-size: 8pt; color: white; background-
color: black}
</STYLE>
<TITLE>Services</TITLE>
<img src="Banner.jpg">
</HEAD>
<SCRIPT language="VBScript">
Sub AboutOver()
Document.Images(01).src = "C:\Test\About\AboutOver.jpg"
End Sub
Sub AboutOut()
Document.Images(01).src = "C:\Test\About\About.jpg"
End Sub
Sub AboutDown()
Document.Images(01).src = "C:\Test\About\AboutDown.jpg"
End sub
</SCRIPT>
<BODY>
<div style="position:absolute; top:102; left:50;">
<a href="C:\Test\About.htm" target="AboutFixed"><img src="C:\Test
\About\About.jpg" onMouseOver="AboutOver" onMouseOut="AboutOut"
onMouseDown="AboutDown"></a>
</div>
<div style="position:absolute; top:102; left:250;">
<img src="C:\Test\Services\ServicesCurrent.jpg">
</div>
</BODY>
</HTML>
ServicesScroll.htm
<HTML>
<HEAD>
<STYLE type="text/css">
p {font-family: Arial; font-size: 12pt; color: white}
img {border: 0}
body {background-color: black}
</STYLE>
</HEAD>
<BODY>
<p>This is some text from the Services page.</p>
</BODY>
</HTML>