How intelligent is Javascript ???

ianv

07-31-2002, 09:43 AM

Hi

I am trying to use Javascript to center my page dynamically, I have come across some code but am unsure what it means, if anybody could decipher it I would be grateful as I am using this to get to grips with javascript.

TIA

in the <body>

<snippet>
<div style="position: absolute; left: 1; top: 0; height: 941; width: 781; id="logo">

external javascript file
---------------

t = navigator.appVersion;
if ((t.indexOf("Mac") != -1)){
u = t.indexOf('MSIE');
v = parseInt(t.substring(u + 5));
if (u != -1 && v >= 4){
document.write('<img src="/pix/dot.gif" height="3000" width="1" border="0">')
}
}

var screenWidth = 0;

if (document.all != null) {
screenWidth = document.body.offsetWidth - 765;
} else if ((navigator.appName == 'Netscape')) {
screenWidth = window.innerWidth - 765;
}

if (screenWidth >= 0) {
screenMargin = screenWidth / 2;
} else {
screenMargin = 0;
}

document.write('<div id="outer" style="position: absolute; left: ' + screenMargin + 'px; top: 5px; z-index: 1">');

window.defaultStatus = 'Intranet.net';

var BannerAdPrefix = ""
function VirginBannerClick(url){top.location = BannerAdPrefix + url}

function sendToAFriend() {
var pn = document.location.href;

window.open("/sendtoafriend/sendtoafriend.html?"
+ pn,"","toolbar=no,scrollbars=no,width=480,height=520,noresize");

}

brothercake

07-31-2002, 12:08 PM

In response to your subject - Javascript, in common with everything else to do with computers, has no intelligence at all.

Anyway - most of that code you posted is redundent. You only need this bit:

var screenWidth = 0;

if (document.all != null) {
screenWidth = document.body.offsetWidth - 765;
} else if ((navigator.appName == 'Netscape')) {
screenWidth = window.innerWidth - 765;
}

if (screenWidth >= 0) {
screenMargin = screenWidth / 2;
} else {
screenMargin = 0;
}

document.write('<div id="outer" style="position: absolute; left: ' + screenMargin + 'px; top: 5px; z-index: 1">');

Except that that will exclude Opera. A cross-browser way of doing the same thing would be:

var pageWidth,pageMargin;

if (typeof document.all != "undefined") {
pageWidth = document.body.offsetWidth - 765;
} else {
pageWidth = window.innerWidth - 765;
}

if (pageWidth >= 0) {
pageMargin = pageWidth / 2;
} else {
pageMargin = 0;
}

document.write('<div id="outer" style="position: absolute; left: ' + pageMargin + 'px; top: 5px; z-index: 1">');

Here I used pageWidth instead of screenWidth because it's less confusing - the value you're defining is not the screen width, it's the page width.

BTW - you don't actually need any of this to get centered content. Any reason for not just going

<div align=center>

?

ianv

07-31-2002, 02:14 PM

Hi

Thanks for the reply. I agree with your point that just a <div align=center> does center the page, however I have some elements in the page like the example below that moves around the screen in different resolutions and does not stay where it is specifed.

However when I used the script I showed you and the div tag I used earlier it stayed in its fixed position, but I was getting the problems I mentioned in the first posting?????

Any advice on this ???

<div id="empnewscont" style="position: absolute; left: 158; top: 295; visibility:hidden; height: 246; width:301">

<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="301">
<tr>
<td height=17 bgcolor=#003063 colspan="2" width="300" background="/images/intranethomepage/docbg1.gif"><font class=modnom>   <a href="##" class="modnom1" onmouseover="hideLayers('presscont'); self.status = 'NEWS'; return true">Press Releases </a>              </font>

<font class=modnom1><a href="##" class="modnom" onmouseover="hideLayers('empnewscont'); self.status = 'NEWS'; return true">Employee News</a>           </font><font class=modnom>
 <img border="0" src="/images/intranethomepage/warrow.gif" align="middle" width="6" height="7"> 
SELECT</font></td>
</tr>
<tr>
<td width="300" colspan="2">
<img border="0" src="/images/intranethomepage/wnewdiv.gif" width="1" height="4"></td>
</tr>

<cfoutput query="empnews">



<tr>

<td width="100%" colspan="2" valign="middle">

<a href="/news/prmain.cfm?id=#id#" class=modtit target="">
<span id="prev_titulo0">#headline#
</span></a></td>
</tr>
<tr>

<td width="60" valign="top">

<p align="center"><a href="/news/newsdetail.cfm?id=#id#" class=modtit target="">

<a href="/news/prmain.cfm?id=#id#" class=modtit target="">
<img border="0" src="/testpages/#imgsrc#" name="prev_imagen_1" width="55" height="55" border=0 vspace=3 align=left></a>
</td>

<td width="240">
<font class=modtxt><span id="prev_texto_2">
#GetToken(ParagraphFormat(fp_summary), 1,".")#
</span></font></td>
</tr>

<tr>
<td width="100%" colspan="2">
<img border="0" src="/images/intranethomepage/newsdiv1.gif" width="1" height="5"></td>
</tr>

</cfoutput>

<tr>
<td width="100%" colspan="2">
<p align="right">
<a href="/news/employeenews.cfm?PRmonth=0&PRyear=0" class=modtit target="">
<span id="prev_titulo0">View More Employee News
</span></a>
</td>
</tr>
</table>

</div>