Results 1 to 4 of 4

Thread: getElementById Script problem

  1. #1
    Join Date
    Dec 2005
    Posts
    133
    Thanks
    23
    Thanked 0 Times in 0 Posts

    Default getElementById Script problem

    I would like to change some features of this script:
    The checkbox is the one who shows and hides the div.

    The div has to be closed when the page loads.
    The row of the checkbox (bgcolor="#808080") has to change color when it shows the content of DIV (becomes #efefef)
    Has to work in Explorer and FF
    Can anyone help pls

    <script type="text/javascript">
    /*
    Made by Martial Boissonneault 2001-2002 http://getElementById.com/
    May be used and changed freely as long as this msg is intact
    Visit http://getElementById.com/ for more free scripts and tutorials.
    */
    function ShowHide(obj, visibility) {
    if(document.getElementById){
    divs = document.getElementsByTagName("div");
    divs[obj].style.visibility = visibility;
    }
    }
    </script>

    <table>

    <tr>
    <td bgcolor="#808080"><input type="checkbox" value="" onclick="ShowHide('lyr1','visible')">
    <a href="#" onclick="ShowHide('lyr1','hidden')">hide</a><br/></td>
    </tr>
    <div id="lyr1">lyr1</div>
    </table>

  2. #2
    Join Date
    Apr 2006
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hello Emanuelle,

    Try to play with the below script to fit your needs:

    Code:
    <html>
    <head>
    <script type="text/javascript">
    function toggleDiv(obj, cont){
    	var el = document.getElementById(obj);
    	var ms = document.getElementById('message');
    	var ct = document.getElementById(cont);
    	if(el.style.visibility != 'visible'){
    		el.style.visibility = 'visible';
    		ms.innerHTML = "click to hide";
            	ct.style.backgroundColor = '#EFEFEF';
    	}else{
    		el.style.visibility = 'hidden';
    		ms.innerHTML = "click to show";
    		ct.style.backgroundColor = '#808080';
    	}
    }
    </script>
    </head>
    <body>
    <form id="myForm">
    <div id="content" style="width:200px; background-color:#808080;">
    	<input type="checkbox" value="" onclick="toggleDiv('lyr1','content')">
    	<span id="message">click to show</span>
    </div>
    <div id="lyr1" style="visibility:hidden;">Hello Emanuelle!</div>
    </form>
    </body>
    </html>

  3. #3
    Join Date
    Dec 2005
    Posts
    133
    Thanks
    23
    Thanked 0 Times in 0 Posts

    Default

    Thank you so much. You are such a great help to me
    I have one more. ok with you??

  4. #4
    Join Date
    Apr 2006
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by emanuelle
    Thank you so much. You are such a great help to me
    I have one more. ok with you??
    You are welcome emanuelle

    For "the one more" start a new thread and maybe me or someone else will have time to answer your question.

Bookmarks

Posting Permissions

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