OH, I see what happened. I misunderstood your 2nd problem. Your IDs are
correct, but since each layer is inside one before it, you are seeing the
bad behavior.
Your layers are nested inside each other, so you need to actually insert
them on top of one another, so you code looks like this:
<div...>layer one</div>
<div...>layer two</div>
<div...>layer three</div>
instead of like this:
<div...>layer one<div...>layer two<div...>layer three</div></div></div>
(notice how they close?)
Then set the proper behaviors.
--
Thanks!
John Jansen
Micosoft Office FrontPage
This posting is provided "AS IS" with no warranties, and confers no rights.
Easily Confused said:
Below is the code from the "Test Page" I am curently working on. If I read
the code right, they appear to have unique attributes already. i.e.;
<div style="position: absolute; width: 786px; height: 472px; z-index: 1;
left: 10px; top: 47px; border: 1px solid #ABD5FF; padding-left: 4px;
padding-right: 4px; padding-top: 1px; padding-bottom: 1px;
visibility:visible" id="layer1"><div style="position: absolute; width:
100px; height: 100px; z-index: 1; left: 104px; top: -1px; visibility:
hidden" id="layer2"><div style="position: absolute; width: 100px; height:
100px; z-index: 1; left: 103px; top: 0px; visibility: hidden" id="layer3">
The whole code is below...
<html><head><meta http-equiv="Content-Language" content="en-us"><meta
name="GENERATOR" content="Microsoft FrontPage 6.0"><meta name="ProgId"
content="FrontPage.Editor.Document"><meta http-equiv="Content-Type"
content="text/html; charset=windows-1252"> said:
function FP_swapImg() {//v1.0
var doc=document,args=arguments,elm,n; doc.$imgSwaps=new Array(); for(n=2; n<args.length;
n+=2) { elm=FP_getObjectByID(args[n]); if(elm) { doc.$imgSwaps[doc.$imgSwaps.length]=elm;
elm.$src=elm.src; elm.src=args[n+1]; } }
}
function FP_preloadImgs() {//v1.0
var d=document,a=arguments; if(!d.FP_imgs) d.FP_imgs=new Array();
for(var i=0; i<a.length; i++) { d.FP_imgs
=new Image; d.FP_imgs.src=a; }
}
function FP_getObjectByID(id,o) {//v1.0
var c,el,els,f,m,n; if(!o)o=document; if(o.getElementById) el=o.getElementById(id);
else if(o.layers) c=o.layers; else if(o.all) el=o.all[id]; if(el) return el;
if(o.id==id || o.name==id) return o; if(o.childNodes) c=o.childNodes; if(c)
for(n=0; n<c.length; n++) { el=FP_getObjectByID(id,c[n]); if(el) return el; }
f=o.forms; if(f) for(n=0; n<f.length; n++) { els=f[n].elements;
for(m=0; m<els.length; m++){ el=FP_getObjectByID(id,els[n]); if(el) return el; } }
return null;
}
function FP_changePropRestore() {//v1.0
var d=document,x; if(d.$cpe) { for(i=0; i<d.$cpe.length; i++) { x=d.$cpe;
if(x.v=="") x.v=""; eval("x."+x.n+"=x.v"); } d.$cpe=null; }
}
function FP_changeProp() {//v1.0
var args=arguments,d=document,i,j,id=args[0],o=FP_getObjectByID(id),s,ao,v,x;
d.$cpe=new Array(); if(o) for(i=2; i<args.length; i+=2) { v=args[i+1]; s="o";
ao=args.split("."); for(j=0; j<ao.length; j++) { s+="."+ao[j]; if(null==eval(s)) {
s=null; break; } } x=new Object; x.o=o; x.n=new Array(); x.v=new Array();
x.n[x.n.length]=s; eval("x.v[x.v.length]="+s); d.$cpe[d.$cpe.length]=x;
if(s) eval(s+"=v"); }
}
// --></script></head><body onload="FP_preloadImgs(/*url*/'button2.jpg',
/*url*/'button3.jpg', /*url*/'button5.jpg', /*url*/'button6.jpg',
/*url*/'button8.jpg', /*url*/'button9.jpg')"><p><img border="0" id="img1"
src="button1.jpg" height="33" width="100" alt="General Info"
onmouseover="FP_swapImg(1,0,/*id*/'img1',/*url*/'button2.jpg')"
onmouseout="FP_swapImg(0,0,/*id*/'img1',/*url*/'button1.jpg');
FP_changePropRestore()"
onmousedown="FP_swapImg(1,0,/*id*/'img1',/*url*/'button3.jpg')"
onmouseup="FP_swapImg(0,0,/*id*/'img1',/*url*/'button2.jpg')"
fp-style="fp-btn: Metal Tab 1" fp-title="General Info"
onclick="FP_changeProp(/*id*/'layer1',1,'style.visibility','inherit')"><img
border="0" id="img2" src="button4.jpg" height="33" width="100" alt="Office
Equip" onmouseover="FP_swapImg(1,0,/*id*/'img2',/*url*/'button5.jpg')"
onmouseout="FP_swapImg(0,0,/*id*/'img2',/*url*/'button4.jpg');
FP_changePropRestore()"
onmousedown="FP_swapImg(1,0,/*id*/'img2',/*url*/'button6.jpg')"
onmouseup="FP_swapImg(0,0,/*id*/'img2',/*url*/'button5.jpg')"
fp-style="fp-btn: Metal Tab 1" fp-title="Office Equip"
onclick="FP_changeProp(/*id*/'layer2',1,'style.visibility','inherit')"><img
border="0" id="img3" src="button7.jpg" height="33" width="100" alt="Misc"
onmouseover="FP_swapImg(1,0,/*id*/'img3',/*url*/'button8.jpg')"
onmouseout="FP_swapImg(0,0,/*id*/'img3',/*url*/'button7.jpg')"
onmousedown="FP_swapImg(1,0,/*id*/'img3',/*url*/'button9.jpg')"
onmouseup="FP_swapImg(0,0,/*id*/'img3',/*url*/'button8.jpg')"
fp-style="fp-btn: Metal Tab 1" fp-title="Misc"></p><div style="position:
absolute; width: 786px; height: 472px; z-index: 1; left: 10px; top: 47px;
border: 1px solid #ABD5FF; padding-left: 4px; padding-right: 4px;
padding-top: 1px; padding-bottom: 1px; visibility:visible" id="layer1"><div
style="position: absolute; width: 100px; height: 100px; z-index: 1; left:
104px; top: -1px; visibility: hidden" id="layer2"><div style="position:
absolute; width: 100px; height: 100px; z-index: 1; left: 103px; top: 0px;
visibility: hidden" id="layer3"> </div><p>Second Layer</div><p
onmouseout="FP_changePropRestore()"
onmouseover="FP_changeProp(/*id*/'img1',1,'style.visibility','visible')">
Insert Text here and here and
here</p><p> </p><p> </p><p> </p><p> </p><p> </div><
/body></html>