Jquery .toggle() first element open

Question

그래서 .toggle()을 사용하여 여러 div를 열고 닫았지만 첫 번째 div는 페이지로드시 열었습니다. 문제는 사용자가 해당 div를 클릭하여 닫을 때 두 번 클릭하면 첫 번째 클릭이 다시 열리도록 시도하는 것입니다. 어떻게해야합니까?

$(document).ready(function(){ 
    $('.content_accrd').css({"height":"0px"}); 
    $('.content_accrd:eq(0)').css({"height":"100px"}); 
    $('.paneltop:eq(0)').css({"background-position":"0px -21px"}) 
$('.paneltop').toggle(function() { 
    $(this).css({"background-position":"0px -21px"}) 
    .siblings('.content_accrd').animate({"height":"100px"}, 200) 
}, function() { 
$(this).css({"background-position":"0px 0px"}) 
    .siblings('.content_accrd').animate({"height":"0px"}, 200); 

}) 
}) 

태그 :

<div id="panel1" class="panel"> 
       <h2 class="panel_title">Capad Clients</h2> 
       <div class="paneltop"> 
       </div> 
       <div class="content_accrd"> 
       <p> 
text 
       </p> 
       </div> 
      </div> 

      <div id="panel1" class="panel"> 
       <div class="paneltop"> 
       </div> 
       <div class="content_accrd"> 
       <p> 
       text 
       </p> 
       </div> 
      </div> 


      <div id="panel1" class="panel"> 
       <div class="paneltop"> 
       </div> 
       <div class="content_accrd"> 
       <p> 
text 
       </p> 
       </div> 
      </div> 

Answer 1

Example

편집 :

이 코드

$(document).ready(function() { 
    $('.content_accrd').css({ 
     "height": "0px" 
    }); 
    $('.content_accrd:eq(0)').css({ 
     "height": "100px" 
    }); 
    $('.paneltop:eq(0)').css({ 
     "background-position": "0px -21px" 
    }) 
    $('.paneltop').click(function() { 
     if ($(this).siblings('.content_accrd').height() != 100) { 
      $(this).css({ 
       "background-position": "0px -21px" 
      }).siblings('.content_accrd').animate({ 
       "height": "100px" 
      }, 200) 
     } else { 
      $(this).css({ 
       "background-position": "0px 0px" 
      }).siblings('.content_accrd').animate({ 
       "height": "0px" 
      }, 200); 
     } 
    }) 
})