|
 |
javascript thread: [javascript]: dot JS file, table, and layers in Navigator
Message #1 by "David E" <registerukh@h...> on Fri, 22 Dec 2000 12:58:24 -0500
|
|
I am having some problems in debuggging the following segment of code. So, I
need your help folks.
<code>
<script language="JavaScript">
NewsThemeLinks = [
["newsAndTheme.gif",
["<font size='-1' face='arial'\>Nov 10 News
Item</font\>","NewsDload.asp?ID=87",""],
["<font size='-1' face='arial'\>Dec 20</font\>","NewsDload.asp?ID=102",""],
],
]
</script>
......
.....
after some other code
....
...
....
<div id="newsAndTheme" style="position:absolute; width:598px; height:24px;
z-index:16; left: 178px; top: 138">
<SCRIPT LANGUAGE="JavaScript" SRC="news-theme-01.js"
TYPE="text/javascript"></SCRIPT>
<LAYER ID=xqq VISIBILITY=SHOW
TOP=&{document.layers[document.layers.length-1].top +
document.layers[document.layers.length-1].document.height + 20};>
<!-- My View Start -->
<layer id=myviewstartlayer visibility=show>
<table width=598 border=0 cellspacing=0 cellpadding=0>
<tr>
<td align=left><img src="myView.gif" width="584" height="23"></td>
<td width=6>
<table cellpadding=0 cellspacing=0 border=0>
<tr>
<td width=6 bgcolor="#ffffff"> </td>
</tr>
<tr>
<td width=6 bgcolor="#cccccc"> </td>
</tr>
</table>
</td>
</tr>
</table>
</layer>
<table width=598 border=0 cellspacing=0 cellpadding=0>
<tr>
<td height=27 >
<table cellpadding=0 cellspacing=0 border=0>
<tr>
<td width=299 bgcolor="#ffffff"> </td>
</tr>
<tr>
<td width=299 bgcolor="#cccccc"> </td>
</tr>
</table>
</td>
<td>
<table cellpadding=0 cellspacing=0 border=0>
<tr>
<td width=299 bgcolor="#ffffff"> </td>
</tr>
<tr>
<td width=299 bgcolor="#cccccc"> </td>
</tr>
</table>
</td>
</tr>
</table>
</LAYER>
</DIV>
<end of Code segment>
And I just have to use Netscape V4.XX browser ONLY as this is an intranet
project.
When I display the page the above segement is in, and see the "source code"
of navigator, I see the following:-
<start of view source>
<div id="newsAndTheme" style="position:absolute; width:598px; height:24px;
z-index:16; left: 178px; top: 138">
<SCRIPT LANGUAGE="JavaScript" SRC="news-theme-01.js" TYPE="text/javascript">
</SCRIPT>
<LAYER ID=xqq VISIBILITY=SHOW
TOP=&{document.layers[document.layers.length-1].top +
document.layers[document.layers.length-1].document.height + 20};>
<!-- My View Start -->
<layer id=myviewstartlayer visibility=show>
<table width=598 border=0 cellspacing=0 cellpadding=0>
<tr>
<td align=left><img src="myView.gif" width="584"
height="23"></td>
<td width=6>
<table cellpadding=0 cellspacing=0 border=0>
<tr>
<td width=6
bgcolor="#ffffff"> </td>
</tr>
<tr>
<td width=6
bgcolor="#cccccc"> </td>
</tr>
</table>
</td>
</tr>
</table>
</layer>
<table width=598 border=0 cellspacing=0 cellpaddin
<LAYER ID=lpl0 VISIBILITY=show LEFT=0><NOBR><IMG src='newsAndTheme.gif'
width='561' height='23' vspace='4'><IMG src='twistieOpen.gif' width='23'
height='23' vspace='4'></NOBR><LAYER></LAYER></LAYER>
<LAYER VISIBILITY=show LEFT=5><FONT FACE='Arial,sans-serif'> <IMG
src='orangeDot.gif' width='8' height='8'><A HREF="NewsDload.asp?ID=87"><FONT
size='-1' face='arial'>Nov 10 News Item</FONT></A></FONT></LAYER>
<LAYER VISIBILITY=show LEFT=5><FONT FACE='Arial,sans-serif'> <IMG
src='orangeDot.gif' width='8' height='8'><A
HREF="NewsDload.asp?ID=102"><FONT size='-1' face='arial'>Dec
20</FONT></A></FONT></LAYER>
<LAYER ID=xqq VISIBILITY=SHOW TOP=89>
<LAYER id=myviewstartlayer visibility=show>
<TABLE width=598 border=0 cellspacing=0 cellpadding=0>
<TR>
<TD align=left><IMG src="myView.gif" width="584"
height="23"></TD>
<TD width=6>
<TABLE cellpadding=0 cellspacing=0 border=0>
<TR>
<TD width=6
bgcolor="#ffffff"> </TD>
</TR>
<TR>
<TD width=6
bgcolor="#cccccc"> </TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
</LAYER>
<TABLE width=598 border=0 cellspacing=0 cellpadding=0>
<TR>
<TD height=27 >
<TABLE cellpadding=0 cellspacing=0 border=0>
<TR>
<TD width=299 bgcolor="#ffffff">
</TD>
</TR>
<TR>
<TD width=299 bgcolor="#cccccc">
</TD>
</TR>
</TABLE>
</TD>
<TD>
<TABLE cellpadding=0 cellspacing=0 border=0>
<TR>
<TD width=299 bgcolor="#ffffff"> </TD>
</TR>
<TR>
<TD width=299 bgcolor="#cccccc"> </TD>
</TR>
</TABLE>
</TD>
</TR>
</TABLE>
</end of view source>
The output from the .js file gets pasted in after layer "myviewstartlayer".
and the table within "myviewstartlayer" layer gets repeated. The layers are
getting messed up when displayed in the browser.
Can anybody tell what's the problem???
<start of news-theme-01.js file>
CatLeft = 100;
SubLeft = 5;
CatTop = 10;
origWidth = window.innerWidth;
origHeight = window.innerHeight;
window.onresize = function (){
if (window.innerWidth==origWidth && window.innerHeight==origHeight) return;
location.reload();
}
FontBeg = "<FONT FACE='Arial,sans-serif'>"
FontEnd = "</FONT>";
Layer.prototype.placeTop = function(ldg){
pLyr = this.siblingBelow;
this.top = pLyr.top + pLyr.document.height + this.topIncr;
}
function reShowNewsTheme(){
document.layers['xqq'].topIncr = CatTop;
allLayers = [];
for (i=0;i<document.layers.length;i++) {
tLyr = document.layers[i];
if (tLyr.visibility=="show") allLayers.push(tLyr);
}
allLayers[0].top = startTop;
for (i=1;i<allLayers.length;i++) {
pLyr = allLayers[i-1];
tLyr = allLayers[i];
tLyr.top = pLyr.top + pLyr.document.height + tLyr.topIncr;
}
}
for (i=0;i<NewsThemeLinks.length;i++) {
arCat = NewsThemeLinks[i];
arCat.title = arCat[0];
document.writeln("");
document.writeln("<LAYER ID=lpl"+i+" VISIBILITY=show LEFT="+0+"><nobr><img
src='" + arCat.title + "' width='561' height='23' vspace='4'><img
src='twistieOpen.gif' width='23' height='23'
vspace='4'></nobr><layer></layer></LAYER>");
tLyr = document.layers[document.layers.length-1];
tLyr.im = tLyr.document.images[1];
tLyr.topIncr = CatTop;
if(i>0) {
tLyr.placeTop();
}
else {
startTop = tLyr.top;
}
tLyr.visibility = "show";
dummyLyr = tLyr.document.layers[0];
dummyLyr.left = dummyLyr.top =0;
dummyLyr.clip.width = tLyr.clip.width;
dummyLyr.clip.height = tLyr.clip.height;
tLyr.isOn = false;
tLyr.captureEvents(Event.MOUSEUP);
tLyr.onmouseup = function(){
this.isOn = !this.isOn;
newVis = (this.isOn)?"hide":"show";
for (i=0;i<this.kids.length;i++){
this.kids[i].visibility = newVis;
}
this.im.src = (this.isOn) ? "twistieClosed.gif" : "twistieOpen.gif";
reShowNewsTheme();
}
tLyr.kids = [];
for (j=1;j<arCat.length;j++) {
tEl = arCat[j];
if(tEl.length == 1) {
document.writeln("<LAYER VISIBILITY=show LEFT="+SubLeft+">" + FontBeg +
tEl[0].bold() + FontEnd + "</LAYER>");
}
else {
dispStr = tEl[0];
linkStr = tEl[1];
dateStr = tEl[2];
contStr =
" <img
src='orangeDot.gif' width='8' height='8'>" + dispStr.link(linkStr);
document.writeln("<LAYER VISIBILITY=show LEFT="+SubLeft+">" + FontBeg +
contStr + FontEnd + "</LAYER>");
}
cLyr = document.layers[document.layers.length-1];
tLyr.kids.push(cLyr);
// cLyr.topIncr = 10;
// controls spacing between url link layers
cLyr.topIncr = 1;
cLyr.placeTop();
}
}
</end of news-theme-01.js file>
I know the above code is too much but I thought I should give all the
details.
Thanks for your time and effort.
_________________________________________________________________
Get your FREE download of MSN Explorer at http://explorer.msn.com
---
NEED TECHNICAL TIPS, TOOLS, AND INSIGHTS? Is FREE okay?
Visit EarthWeb for the latest in IT Management, Software Development,
Web Development, Networking & Communications, and Hardware & Systems.
Click on http://www.earthweb.com for FREE articles, tutorials,
and discussions from the experts.
---
You are currently subscribed to javascript as: $subst('Recip.EmailAddr')
To unsubscribe send a blank email to leave-javascript-$subst('Recip.MemberIDChar')@p2p.wrox.com
|
|
 |