Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New Coder
    Join Date
    Sep 2009
    Posts
    78
    Thanks
    17
    Thanked 1 Time in 1 Post

    if display:none, then do something...

    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):

    Code:
    <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.

  • #2
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,335
    Thanks
    11
    Thanked 588 Times in 569 Posts
    Code:
    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...
    Last edited by rnd me; 12-15-2010 at 06:56 AM.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #3
    New Coder
    Join Date
    Sep 2009
    Posts
    78
    Thanks
    17
    Thanked 1 Time in 1 Post
    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:

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

  • #4
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,511
    Thanks
    3
    Thanked 504 Times in 491 Posts
    try

    Code:
    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';
    }
    Last edited by vwphillips; 12-15-2010 at 08:58 AM.
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #5
    New Coder
    Join Date
    Sep 2009
    Posts
    78
    Thanks
    17
    Thanked 1 Time in 1 Post
    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?

  • #6
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,511
    Thanks
    3
    Thanked 504 Times in 491 Posts
    Code:
    <!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>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #7
    New Coder
    Join Date
    Sep 2009
    Posts
    78
    Thanks
    17
    Thanked 1 Time in 1 Post
    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.

  • #8
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,986
    Thanks
    203
    Thanked 2,536 Times in 2,514 Posts
    Code:
    if ((zxcSV(document.getElementById('why-choose-content'),'display')== 'none') &&(......))


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •