471,596 Members | 826 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,596 software developers and data experts.

Restrictions on style settings

Claus Mygind
571 512MB
I want to move some style setting into a javaScript function so I can make them variable but I get "invalid assignment left-hand side" error?

see my question at the bottom of this message.

It works fine when I stream it out in my html page like this:
<DIV
ID="popSearch"
STYLE="
position:absolute;
visibility:hidden;
background-color:#E4BF87;
border-style: ridge;
border-width: 5px;
border-color: orange;
z-index:99;"
>

The division is made visible via a on screen button which calls this js function:

function showPopSearch( ) {
if ( document.getElementById("popSearch").style.visibil ity == "hidden" ) {
// document.getElementById("popSearch").style.backgro und-color = "#E4BF87";
// document.getElementById("popSearch").style.border-style = "ridge";
// document.getElementById("popSearch").style.border-width = "5px";
// document.getElementById("popSearch").style.border-color = "orange";
document.getElementById("popSearch").style.z-index = "99";
document.getElementById("popSearch").style.visibil ity = "visible";
document.getElementById("pBdataSpan").style.overfl ow = "auto";
showGetSearch();
}else{
document.getElementById("popSearch").style.visibil ity = "hidden";
document.getElementById("pBdataSpan").style.overfl ow = "hidden";
}
}

function showGetSearch( ) {
var cHeight = "175";
var cWidth = "450";
var cLeft = parseInt((screen.availWidth/2) - (cWidth/2));
var cTop = parseInt((screen.availHeight/2) - (cHeight/2) - 50);
document.getElementById("popSearch").style.left = cLeft + "px";
document.getElementById("popSearch").style.top = cTop + "px";
document.getElementById("popSearch").style.height = cHeight + "px";
document.getElementById("popSearch").style.width = cWidth + "px";
}


Question: Why cannot these style parameters be removed from the <STYLE> tag and be placed in the js function?

Please note that when I move them to the js function I remove them from the <STYLE> tag inclusion so they are not duplicated!

document.getElementById("popSearch").style.backgro und-color = "#E4BF87";
document.getElementById("popSearch").style.border-style = "ridge";
document.getElementById("popSearch").style.border-width = "5px";
document.getElementById("popSearch").style.border-color = "orange";

it appears that only the following style settings work for me:
.visibility
.top
.left
.width
.height
.overflow
May 28 '08 #1
3 1864
hsriat
1,654 Expert 1GB
In CSS, if its background-image, in JavaScript, its backgroundImage...

See, all your problem giving code lines contain a style property with a hyphen in it. Remove them and make the immediate next letters capital.
May 28 '08 #2
Claus Mygind
571 512MB
Thanks,

That did the trick as you knew it would

Claus
May 28 '08 #3
hsriat
1,654 Expert 1GB
Thanks,

That did the trick as you knew it would

Claus
I knew it would do the trick, but I'm still glad to know that the trick actually helped you.
May 28 '08 #4

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

7 posts views Thread by seans | last post: by
3 posts views Thread by Dmitri Shvetsov | last post: by
3 posts views Thread by Luciano | last post: by
reply views Thread by XIAOLAOHU | last post: by
reply views Thread by leo001 | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.