I posted a very long message regarding my experiences with JavaScript,
one reply was posted asking I post an example of the problem -- and
both are gone! Is there a moderator that removes such stuff?
In any case, here is the issue in brief:
I want to keep the page invisible while my onload script decides how
to format it, setting colors, downloads images, etc. The style
"visibility:hid den" in the body tag almost does it -- except non-zero
table borders still show. The workaround was to set them to zero in
the page itself and use javascript to set them to the desired value at
the same time that it makes the page visible.
But shouldn't the borders be rendered invisible by the body style
without that?
Here are stripped versions of the html and the script file it loads.
Copy both to your disk (watch out for wraparound line breaks!), naming
the script file "scripfile. js", doubleclick the .html file, and you'll
see it happen, since I put in an "alert" at the top of the script to
let you view the page before the startup code formats it and makes it
visible.
BTW: I'm on IE 6.0.
example.html:
-------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/1998/REC-html40-19980424/loose.dtd">
<html>
<head><meta content="text/html; charset=UTF-8">
<SCRIPT LANGUAGE="JavaS cript" src="scriptfile .js">
</SCRIPT>
<title>Pricin g</title>
<STYLE type="text/css">
</STYLE>
</head>
<body style="visibili ty: hidden" OnLoad="javascr ipt:startup()">
<basefont>
<table id="bprods" align="center" width="85" border="3" rules="rows"
cellspacing="0" cellpadding="0" >
<colgroup align="right" valign="center" >
<col width="35">
<col width="45">
<tr><td>Qty<td> Price</tr>
<tr><td><inpu t type="text" size="1" maxlength=2 value="1"
onkeyup="setpri ce(this);" onblur="checkpr ice(this);"><td
class="pr">99.9 9</tr>
<tr><td><inpu t type="text" size="1" maxlength=2 value="1"
onkeyup="setpri ce(this);" onblur="checkpr ice(this);"><td
class="pr">231. 42</tr>
</table>
</body>
</html>
scriptfile.js:
--------------
// global variables
var prices = new Array();
var entered;
function startup() {
alert("startup" );
// in the real page, there are graphics being downloaded, scripting of
them to be run,
// etc., that I don't want the user to see until it's all set up.
// also, the actual script selects the styles to apply, rather than
just applying
// the one set of styles here, and I don't want to display the raw
page without
// formatting while the graphics are being set up. the process of
setting up
// the graphics also chooses the styles, so I can't set them until the
downloads
// are complete. and yes, I figured out a way to wait for them to
complete,
// that's not germane to this problem.
// pick up the data for computing prices for selected quantities
var whereis;
if (document.getEl ementById("bpro ds") ) {
for (var i=1; i<bprods.rows.l ength; i++) {
whereis=bprods. rows[i].cells[1].sourceIndex;
// get rid of commas, any currency sign, other text not part of the
price
prices[whereis] =
Number(document .all[whereis].innerText.repl ace(/[^0-9.]/g,''));
document.all[whereis].innerText =
(Number(documen t.all[whereis-1].value)*prices[whereis]).toFixed(2);
}
}
// format the page
document.body.b gColor="#f0f0f0 ";
document.styleS heets[0].addRule("INPUT ","border:solid ; border-width:
1; border-color: purple; font-family: Arial; font-style: italic;
font-weight: bold; color:purple");
document.styleS heets[0].addRule("TD.pr ","font-family: Arial
font-style: italic; font-weight: bold; color:purple");
document.styleS heets[0].addRule("BASEF ONT","font-family: Times;
font-size: 10pt; color:darkblue; font-style: italic; font-weight:
bold");
document.body.s tyle.visibility ="visible";
}
function setprice(here) {
// get the value entered, if it is invalid, get rid of the
non-numerics -- which
// puts it back to the value before that last keystroke, so the price
// already on the page is valid -- issue an alert, and exit.
// otherwise, get the selling price and display it.
entered = here.value;
var vvv = entered.replace (/[^0-9]/g,'');
if (entered != vvv && entered != '') {
here.value=vvv;
alert("Please type a number");
}
else {
if (entered == '') {
document.all[here.sourceInde x+1].innerText='';
}
else {
document.all[here.sourceInde x+1].innerText=(Num ber(vvv)*prices[here.sourceInde x+1]).toFixed(2);
}
}
entered = '';
}
function checkprice(here ) {
// called when focus disappears from the current INPUT element.
// if the entry is null or zero, make it 1 and restore the unit
price.
if (entered == '' && (here.value == 0 || here.value == "") ) {
here.value=1;
document.all[here.sourceInde x+1].innerText=pric es[here.sourceInde x+1];
}
}
one reply was posted asking I post an example of the problem -- and
both are gone! Is there a moderator that removes such stuff?
In any case, here is the issue in brief:
I want to keep the page invisible while my onload script decides how
to format it, setting colors, downloads images, etc. The style
"visibility:hid den" in the body tag almost does it -- except non-zero
table borders still show. The workaround was to set them to zero in
the page itself and use javascript to set them to the desired value at
the same time that it makes the page visible.
But shouldn't the borders be rendered invisible by the body style
without that?
Here are stripped versions of the html and the script file it loads.
Copy both to your disk (watch out for wraparound line breaks!), naming
the script file "scripfile. js", doubleclick the .html file, and you'll
see it happen, since I put in an "alert" at the top of the script to
let you view the page before the startup code formats it and makes it
visible.
BTW: I'm on IE 6.0.
example.html:
-------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/1998/REC-html40-19980424/loose.dtd">
<html>
<head><meta content="text/html; charset=UTF-8">
<SCRIPT LANGUAGE="JavaS cript" src="scriptfile .js">
</SCRIPT>
<title>Pricin g</title>
<STYLE type="text/css">
</STYLE>
</head>
<body style="visibili ty: hidden" OnLoad="javascr ipt:startup()">
<basefont>
<table id="bprods" align="center" width="85" border="3" rules="rows"
cellspacing="0" cellpadding="0" >
<colgroup align="right" valign="center" >
<col width="35">
<col width="45">
<tr><td>Qty<td> Price</tr>
<tr><td><inpu t type="text" size="1" maxlength=2 value="1"
onkeyup="setpri ce(this);" onblur="checkpr ice(this);"><td
class="pr">99.9 9</tr>
<tr><td><inpu t type="text" size="1" maxlength=2 value="1"
onkeyup="setpri ce(this);" onblur="checkpr ice(this);"><td
class="pr">231. 42</tr>
</table>
</body>
</html>
scriptfile.js:
--------------
// global variables
var prices = new Array();
var entered;
function startup() {
alert("startup" );
// in the real page, there are graphics being downloaded, scripting of
them to be run,
// etc., that I don't want the user to see until it's all set up.
// also, the actual script selects the styles to apply, rather than
just applying
// the one set of styles here, and I don't want to display the raw
page without
// formatting while the graphics are being set up. the process of
setting up
// the graphics also chooses the styles, so I can't set them until the
downloads
// are complete. and yes, I figured out a way to wait for them to
complete,
// that's not germane to this problem.
// pick up the data for computing prices for selected quantities
var whereis;
if (document.getEl ementById("bpro ds") ) {
for (var i=1; i<bprods.rows.l ength; i++) {
whereis=bprods. rows[i].cells[1].sourceIndex;
// get rid of commas, any currency sign, other text not part of the
price
prices[whereis] =
Number(document .all[whereis].innerText.repl ace(/[^0-9.]/g,''));
document.all[whereis].innerText =
(Number(documen t.all[whereis-1].value)*prices[whereis]).toFixed(2);
}
}
// format the page
document.body.b gColor="#f0f0f0 ";
document.styleS heets[0].addRule("INPUT ","border:solid ; border-width:
1; border-color: purple; font-family: Arial; font-style: italic;
font-weight: bold; color:purple");
document.styleS heets[0].addRule("TD.pr ","font-family: Arial
font-style: italic; font-weight: bold; color:purple");
document.styleS heets[0].addRule("BASEF ONT","font-family: Times;
font-size: 10pt; color:darkblue; font-style: italic; font-weight:
bold");
document.body.s tyle.visibility ="visible";
}
function setprice(here) {
// get the value entered, if it is invalid, get rid of the
non-numerics -- which
// puts it back to the value before that last keystroke, so the price
// already on the page is valid -- issue an alert, and exit.
// otherwise, get the selling price and display it.
entered = here.value;
var vvv = entered.replace (/[^0-9]/g,'');
if (entered != vvv && entered != '') {
here.value=vvv;
alert("Please type a number");
}
else {
if (entered == '') {
document.all[here.sourceInde x+1].innerText='';
}
else {
document.all[here.sourceInde x+1].innerText=(Num ber(vvv)*prices[here.sourceInde x+1]).toFixed(2);
}
}
entered = '';
}
function checkprice(here ) {
// called when focus disappears from the current INPUT element.
// if the entry is null or zero, make it 1 and restore the unit
price.
if (entered == '' && (here.value == 0 || here.value == "") ) {
here.value=1;
document.all[here.sourceInde x+1].innerText=pric es[here.sourceInde x+1];
}
}
Comment