...

View Full Version : if display:none, then do something...



cpkid2
12-15-2010, 06:43 AM
I'm trying to set an if statement so if one element is set to display:none, another element(s) sets margin-left to a certain number of pixels.

Sort of like this (however, it's not working):



<script>
if (document.getElementById('#why-choose-content').style.display = 'none') {
document.getElementById('#always-content').style.margin-left = '335px';
}
</script>


Here is the site in question: http://bit.ly/8XfM0Q

You can get a better idea of what I mean by clicking the 'plus' icons for the three colored tabs above the main content. Or if anybody has a more elegant way to get the divs to toggle under their respective headers, I'd love to hear. Thank you.

rnd me
12-15-2010, 06:48 AM
if (document.getElementById('why-choose-content').style.display == 'none')

don't use a single equal sign inside an if statement until at least a year from now.
also, with your hash intake...

cpkid2
12-15-2010, 07:30 AM
Thanks for the help, rnd me.

I changed it to the following, however it's still not working as you can see in the link in the op:


<script>
if (document.getElementById('why-choose-content').style.display == 'none') {
document.getElementById('always-content').style.margin-left == '335px';
}
</script>

vwphillips
12-15-2010, 08:50 AM
try



function zxcSV(obj,par){
if (obj.currentStyle) return obj.currentStyle[par.replace(/-/g,'')];
return document.defaultView.getComputedStyle(obj,null).getPropertyValue(par.toLowerCase());
}

if (zxcSV(document.getElementById('why-choose-content'),'display')== 'none') {
document.getElementById('always-content').style.margin-left = '335px';
}

cpkid2
12-15-2010, 09:06 AM
vwphillips,

I replaced the code w/ the one you gave me and the boxes don't slide anymore. Is there something else I need to do or did I misplace the code?

vwphillips
12-15-2010, 12:33 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title></title>
<style type="text/css">
/*<![CDATA[*/
.tst {
display:none;
}

/*]]>*/
</style></head>

<body>
<div id="why-choose-content" class="tst" ></div>
<script type="text/javascript">

function zxcSV(obj,par){
if (obj.currentStyle) return obj.currentStyle[par.replace(/-/g,'')];
return document.defaultView.getComputedStyle(obj,null).getPropertyValue(par.toLowerCase());
}

if (zxcSV(document.getElementById('why-choose-content'),'display')== 'none') {
alert("document.getElementById('always-content').style.margin-left = '335px';");
}
</script>
</body>

</html>

cpkid2
12-15-2010, 06:04 PM
Thanks! How can I add an & to that?

For example, if why-choose-content is display:none and always-content is display:block, then...support-content is marginLeft:50px.

Philip M
12-16-2010, 09:04 AM
if ((zxcSV(document.getElementById('why-choose-content'),'display')== 'none') &&(......))



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum