简体   繁体   中英

Toggling a div with another div

i am trying to make a div toggle another div which appears underneath it.

I have managed to do this with a button, however i was wondering if you could do this with another div, so that when you clicked anywhere inside the div, it would make the other div appear and disappear etc...

Here are the two divs i have

//This div is the one you click on
      <div id="more_toggle"></div><!---end more_toggle--->

//This div is the one that appears and disappears through the toggle        
      <div id="more_info">hello</div><!---end more_info--->

This is the script i use to toggle the divs through buttons, but it doesn't work with another div

$(function(){    
    $("#server_status_button").click(function(event){
        event.preventDefault();
        $("#status1").slideToggle();
    });    
});

Thanks for any help

$("#more_toggle").click(function(event) {
    $("#more_info").slideToggle();
});​

jsFiddle example

Have you tried:

$(function() {
    $('#more_toggle').click(function(e) {
          $('#more_info').slideToggle();
    });
});

If you want to hide use display toggling just try .toggle() instead of .slideToggle().

$('#more_toggle').click(function(){
    $('#more_info').slideToggle(); 
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM