Div 또는 Element 표시/숨기기

Question

사이트를 방문하여 많은 기능을 접해 왔지만 그것을 복제하는 방법을 알 수 없습니다! XD 누군가 나를 도울 수 있습니까?

this site's 저작권 표시의 기능을 복제하고 싶습니다. 내 사이트에 대한 크레딧을 제공하고 싶습니다.

정말 감사하겠습니다. 고맙습니다.

Answer 1

추천 사이트는 jQuery library을 사용합니다. 정말 간단합니다. 성명 등이

$("#mydiv").hide(); 

는 ID가 "mydiv"와 <div> 숨 깁니다. hide 대신 show을 사용할 수도 있으며, 함수에 숫자를 전달할 수 있습니다. hide(200)을 클릭하면 동작이 애니메이션으로 표시됩니다. 이 경우 div의 숨기기를 200ms 이상 움직이게합니다.

요소를 숨기거나 표시하는 toggle effect도 있습니다.

jQuery documentation에서 jQuery 이벤트 및 선택기에 대해 읽어 보는 것이 좋습니다. 미래 또한

, Googling your question 당신이 요청하기 전에 당신에게 ;-)

---

편집

은 실제로 당신이 링크는 사이트에 설명하고있는 특정 기능은 시간을 절약 할 수 HTML5 요소를 사용하여 처리되었습니다. andronikus 회담 HTML5는 아직 처리 할 수없는 많은 브라우저가 있기 때문에 아직 웹에서 사용할 준비가되어 있지 않습니다. 제 의견으로는 jQuery show/hide를 사용하는 것이이 시점에서 더 나은 해결책입니다.

Answer 2

마우스 오른쪽 버튼으로 "요소 검사"를 허용하는 브라우저 또는 확장 프로그램을 사용하는 경우 페이지 요소의 코드를 직접 볼 수 있습니다. 이 페이지에서는 HTML5의 새로운 [<details>][1] 태그를 사용하고 있습니다. 다음과 같이 보인다 : 엉망에

<details> 
    <summary>Always show this</summary> 
    <p>This stuff is hidden until you click the arrow.</p> 
    <p>Woooo!</p> 
</details> 

아니 자바 스크립트/JQuery와, 너무 일어나고 일부 CSS 아마 거기에 있지만. 이것은 매우 멋진 새로운 요소입니다!

은 (일반적으로 이것은 다른 답변과 의견에 설명 된대로 jQuery를 쇼()/숨기기()와 함께 할 것입니다. 나는 그것이 매우 일반적인 기능이기 때문에이 HTML5에 추가 된 의심한다.)

Answer 3

당신이 할 수있는 jQuery slideToggle()을 사용하여 구현하십시오.

<div id="inner"> 
    <div class="text"> 
    Your Text 
    </div> 
</div 


$(document).ready(function(){ 
$(".text").hide(); 
$("#inner").click(function(){ 
$(".text").slideToggle(); 
}); 
}); 

현재 http://www.sendesignz.com/index.php/jquery/72-how-to-implement-toggle-search-box-in-jquery