Forum Moderators: open
I've been trying to learn slightly more sophistocated scripts and I'm starting to get the feel of it, but I can't get past this last error (go figure right!) haha!
I'm getting the error "Error in parsing value for property 'width'" for two scripts (as well as the hieght for one of them since only the first script needs the height defined).
I'm really proud though cuz I *think* I cleaned the code a little better. I don't feel so frustrated because I think I am actually learning this! IoI... Heres the code! I am testing this in 12/30/04 nightly build of Firefox and would like to get this to work in Opera, IE, and Gecko browsers.
Also I want to make sure I can use the divcontent script multiple times without it having different widths like I have encountered but I have no clue how to get around that one ... though I just want to get the current JS errors out of the way ...
Oh yeah, right now here is how the script is acting, in FF the divbody renders perfectly (at least in my build). In IE the divcontent renders the way I want it. The goal is to have a 10px margin on all sides of the divbody and to have a 100% width minus 130pixels for divcontent. Will CSS3 support math functions?
<!-- -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title></title>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type" />
<style>
body {
background: #000000;
color: #a7a68f;
cursor: url("http://example.com/themes/classic/cursor-normal.ani"), default;
font-family: Arial, sans-serif;
font-size: 12px;
margin: 0px;
padding: 0px;
}
div.body {
background: #000000;
border: 1px solid #FFFFFF;
bottom: 10px;
left: 10px;
margin: 0px 0px 0px 0px;
overflow: auto;
padding: 12px 0px 0px 0px;
position: absolute;
right: 10px;
top: 10px;
z-index: 1;
}
div.content {
background: url("http://example.com/themes/classic/interface-inset.gif") repeat-y 100% 0;
border: 1px solid #a7a68f;
border-width: 1px 1px 1px 1px;
float: right;
margin: 0px 0px 0px 0px;
right: 200px;
}</style>
</head><body>
<script type="text/javascript">
<!--
var divbody;
var bodywidth = document.body.clientWidth-20;
var bodyheight = document.body.clientheight-20;
function setDivSize()
{
document.getElementById('divbody').style.width = bodywidth;
document.getElementById('divbody').style.height = bodyheight;
}
document.writeln('<div id="divbody" class="body">')//-->
</script><script type="text/javascript">
<!--
var divcontent1;
var contentwidth = document.body.clientWidth-130;
function setTableSize()
{
document.getElementById('divcontent1').style.width = contentwidth;
}
document.writeln('<div id="divcontent1" class="content">');
//-->
</script><p>This is the divcontent1 Div.</p>
<script type="text/javascript">
<!--
setTableSize();
document.writeln('</div>')
//-->
</script><script type="text/javascript">
<!--
setDivSize(divbody);
document.writeln('</div>')
//-->
</script></body>
</html>
[edited by: tedster at 7:07 pm (utc) on Dec. 31, 2004]
[edit reason] use 'example.com' in the script [/edit]
var bodyheight = document.body.clientheight-20; clientheightclient[b]H[/b]eight2 >
document.getElementById('divcontent1').style.width = contentwidth;You are using XML strict, which requires the use of units in CSS.
This may well be the source of your error message.
Try:
document.getElementById('divcontent1').style.width = contentwidth [b]+ 'px'[/b]Good to see you're getting there!
