자바 스크립트 표시/숨기기 :

Question

표시로 설정하는 방법은 다음과 같은 코드가 있습니다 표시하는

이

<a class="button" href="javascript:ShowHide('elaborate_1')" style="font-size:24px; padding:0 10px; margin-left:10px;">COLLAPSE</a> 

     <div id="elaborate_1" class="expandable-box" style="display:none;"> 

       <div class="description"><?php //USE THIS CLASS 'description' ON A 'div' TAG FOR A GRAY BOX TO DISPLAY CONTENT ?> 
       <p class="nomargin nopadding">HELLO</p> 
       </div><!-- .descpription --> 

     </div> 

웹 페이지가 현재이 메시지 "안녕하세요"나는 "붕괴"를 클릭 할 때까지하지만 내가 원하는 내용을 숨 깁니다을 자동 전까지는 붕괴 "를 클릭

을 나는이

Answer 1

변경을 표시 할 수있는 방법.? 아무것도 표시하지 않을 :. 당신의 elaborate_1의 DIV에 블록을

Answer 2

디스플레이를 제거 : 없음을에서 포함 요소 :

<div id="elaborate_1" class="expandable-box"> 

ShowHide 기능이 올바르다면 작동해야합니다. 그렇지 않은 경우 함수에서 코드를 게시해야합니다.

Answer 3

그냥

document.getElementById("elaborate_1").style.display = "block"; 

는 개인적으로 나는 JQuery와 한 번 봐 복용 제안 당신의 html 요소

에서 style="display:none;"를 제거하고 (참조) 당신의 js 함수에 다음 코드를 추가합니다. 그것은 당신이 쇼, 숨기기, 토글, 페이드, 커스텀 애니메이션 등과 같은 다양한 효과를 제어 할 수있게합니다. 여기에 링크가 있습니다 : http://api.jquery.com/category/effects/ 당신에게 유용 할 것입니다.

약간 JQuery와 샘플 코드 : 초기 마크 업에서 "아무도 디스플레이"

$('a.button').click(function(){ 
    $('#elaborate_1').toggle("slow"); 
});