Frames in dreamweaver???

a frame? as in iframe or frameset? its been some time, but i believe it done with the target attribute on the a tag, something like this

Code:
<a href="#" target="<your frame name>" >TEXT</a>

then you have to set the name of the frame with the name attribute, name="XXX"

bit it has been ages since iv used frames
 
is there a better way of doing it?

what i have is all my links and things around the outside but what i want is when someone clicks a link, the only thing i want to change is the frame.
 
ace2109 said:
is there a better way of doing it?

It's possible to set the source of a frame with JavaScript. I can't remember how offhand, but if you think that's a viable option then let me know, I'll look into it for you.

Jon
 
OK well frames are part of JavaScript Document Object Model, so you can access them with:

parent.frame_name
or
parent.frames[index] (index being a number from 0 to the number of frames, ie. frames[0] would be the first frame in the array).

To set the location, you would do something like:
parent.frame_name.document.href="mypage.html";

And you could easily stick that into an event handler, so this link would load the page "page1.htm" into the frame called "display":
<a href="#" onClick="parent.display.document.href='page1.htm';">Load Page</a>

Hope that helps a bit.

Jon
 
Where would i fit that into my code:

<style type="text/css">
<!--
#Layer1 {
position:absolute;
width:200px;
height:115px;
z-index:0;
}
#Layer2 {
position:absolute;
width:1029px;
height:71px;
z-index:4;
left: -5px;
top: 88px;
}
#Layer3 {
position:absolute;
width:1026px;
height:115px;
z-index:2;
left: -1px;
top: 142px;
}
#Layer4 {
position:absolute;
width:101px;
height:43px;
z-index:3;
left: 634px;
top: 62px;
}
#Layer5 {
position:absolute;
width:102px;
height:44px;
z-index:-1;
left: 633px;
top: 27px;
}
#Layer6 {
position:absolute;
width:100px;
height:44px;
z-index:0;
left: 746px;
top: 62px;
}
#Layer7 {
position:absolute;
width:100px;
height:40px;
z-index:1;
left: 858px;
top: 62px;
}
#Layer8 {
position:absolute;
width:200px;
height:361px;
z-index:5;
left: 1px;
top: 160px;
}
#Layer9 {
position:absolute;
width:208px;
height:25px;
z-index:6;
left: 693px;
top: 114px;
}
#Layer10 {
position:absolute;
width:200px;
height:115px;
z-index:6;
left: 310px;
top: 257px;
}
#Layer11 {
position:absolute;
width:189px;
height:24px;
z-index:6;
left: 703px;
top: 114px;
}
#Layer12 {
position:absolute;
width:58px;
height:35px;
z-index:1;
left: 661px;
top: -97px;
}
.style2 {
font-size: 19px;
font-family: Calibri;
color: #FFFFFF;
}
#Layer13 {
position:absolute;
width:63px;
height:32px;
z-index:7;
left: 767px;
top: 64px;
}
body,td,th {
font-family: Calibri;
}
.style3 {
font-size: 19px;
color: #FFFFFF;
}
#Layer14 {
position:absolute;
width:47px;
height:33px;
z-index:8;
left: 886px;
top: 63px;
}
#Layer15 {
position:absolute;
width:200px;
height:115px;
z-index:9;
left: -491px;
top: 158px;
}
#Layer16 {
position:absolute;
width:512px;
height:44px;
z-index:9;
left: 209px;
top: 486px;
}
#Layer17 {
position:absolute;
width:821px;
height:387px;
z-index:9;
left: -459px;
top: 100px;
overflow: auto;
}
body {
background-color: #FFFFFF;
}
.style4 {color: #000000}
-->
</style>
<script type="text/JavaScript">
<!--
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}
//-->
</script>
<div id="Layer11">
<form name="form1" id="form1">
<select name="Select page to jump to....." id="Select page to jump to....." onchange="MM_jumpMenu('parent',this,0)">
<option>Select page to jump to.....</option>
<option value="/Home Services.html">Home Services</option>
<option value="/Business Services.html">Business Services</option>
<option value="/Future Proofing.html">Future Proofing</option>
<option value="/Jargon Buster.html">Jargon Buster</option>
<option value="/Links.html">Links</option>
</select>
</form>
</div>
<div id="Layer4"><img src="/Images/main-layout_03.gif" alt="Home" width="100" height="25" /></div>
<div id="Layer6"><img src="/Images/main-layout_03.gif" alt="Contact" width="100" height="25" /></div>
<div id="Layer7"><img src="/Images/main-layout_03.gif" alt="About Us" width="100" height="25" /></div>
<div id="Layer2"><img src="/Images/main-layout_11.gif" width="1032" height="55" /></div>
<div id="Layer3"><img src="/Images/main-layout_12.gif" width="1027" height="18" /></div>
<div id="Layer8"><img src="/Images/main-layout_13.gif" alt="Main Menu" width="188" height="388" />
<div class="style2" id="Layer12">Home </div>
</div>
<div class="style3" id="Layer13">Contact</div>
<div class="style3" id="Layer14">Links</div>
 
AFAIK, you can't open a page inside an element.

The best I can think of as far as that goes is to set the innerHTML of the element:
document.getElementById('content_div_id').innerHTML="content content content";

To be honest, I think you'd be better of using an IFRAME here.

Jon
 
Back
Top Bottom