.hide ()
.hide ()
설명 : 일치하는 요소를 숨 깁니다.
매개 변수 .hide()없이이 메서드는 요소를 숨기는 가장 간단한 방법입니다.
$( ".target" ).hide();
일치하는 요소는 애니메이션없이 즉시 숨겨집니다. 이것은 호출 .css( "display", "none" )과 거의 동일하지만 , 나중에 displayjQuery의 데이터 캐시에 저장되므로 display나중에 초기 값으로 복원 될 수 있습니다. 요소가 display값이 inline있고 숨겨져 표시되면 다시 한 번 표시됩니다 inline.
지속 시간, 일반 객체 또는 "완료"함수가 제공 .hide()되면 애니메이션 메소드가됩니다. 이 .hide()메서드는 일치하는 요소의 폭, 높이 및 불투명도를 동시에 애니메이션합니다. 이러한 속성이 0에 도달하면 displaystyle 속성은 none요소가 더 이상 페이지의 레이아웃에 영향을 미치지 않도록 설정됩니다 .
기간은 밀리 초 단위로 표시됩니다. 값이 높을수록 느린 애니메이션이 아니라 빠른 애니메이션이 표시됩니다. 문자열 'fast'및 'slow'은 각각 지속 시간 200및 600밀리 초 를 나타 내기 위해 제공 될 수 있습니다 .
그 주 .hide()즉시 해고 및 지속 기간 또는 0의 기간이 지정되지 않은 경우 애니메이션 대기열을 우선합니다.
jQuery 1.4.3부터 , easing 함수를 명명하는 선택적 문자열을 사용할 수 있습니다. 이징 함수는 애니메이션 내의 다른 지점에서 애니메이션이 진행되는 속도를 지정합니다. jQuery 라이브러리의 유일한 구현 구현은 기본 호출 swing, 호출 , 일정한 속도로 진행되는 호출 linear이다. 더 많은 easing 함수는 플러그인, 특히 jQuery UI suite를 사용할 때 사용할 수 있습니다 .
제공된 경우 애니메이션이 완료되면 콜백이 시작됩니다. 이는 서로 다른 애니메이션을 차례로 문자열로 연결하는 데 유용 할 수 있습니다. 콜백은 어떤 인수도 보내지 않지만 this애니메이션이 적용되는 DOM 요소로 설정됩니다. 여러 요소가 애니메이션으로 표시되는 경우 콜백은 애니메이션 전체에 대해 한 번이 아니라 일치 된 요소 당 한 번 실행된다는 점에 유의해야합니다.
참고 : 이 방법은 특히 많은 요소에서 사용될 때 성능 문제를 일으킬 수 있습니다. 이러한 문제가 발생하는 경우 성능 테스트 도구를 사용하여이 방법으로 인해 문제가 발생하는지 확인하십시오. 또한이 방법은 표시 값이 다른 뷰포트 크기에서 다를 경우 반응 형 레이아웃에서 문제를 일으킬 수 있습니다.
간단한 이미지와 같은 요소를 애니메이트 할 수 있습니다
<div id="clickme">
Click here
</div>
<img id="book" src="book.png" alt="" width="100" height="123">
// With the element initially shown, we can hide it slowly:
$( "#clickme" ).click(function() {
$( "#book" ).hide( "slow", function() {
alert( "Animation complete." );
});
});
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>hide demo</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p>Hello</p>
<a href="#">Click to hide me too</a>
<p>Here is another paragraph</p>
<script>
$( "p" ).hide();
$( "a" ).click(function( event ) {
event.preventDefault();
$( this ).hide();
});
</script>
</body>
</html>
게시판 목록
개발자팁
질문은 QA에서 해주시기 바랍니다.
| 번호 | 분류 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|---|
| 5096 | PHP | 3년 전 | 1497 | ||
| 5095 | JavaScript | 3년 전 | 2126 | ||
| 5094 | JavaScript | 3년 전 | 2045 | ||
| 5093 | 기타 | 3년 전 | 1415 | ||
| 5092 | JavaScript | 3년 전 | 1962 | ||
| 5091 | 기타 |
 레드불355 |
3년 전 | 1317 | |
| 5090 | 기타 |
레드불355 |
3년 전 | 2255 | |
| 5089 | 웹서버 |
 SIR개발팀 |
3년 전 | 3330 | |
| 5088 | JavaScript | 3년 전 | 2059 | ||
| 5087 | 기타 | 3년 전 | 1656 | ||
| 5086 | 웹서버 |
SIR개발팀 |
3년 전 | 1700 | |
| 5085 | node.js | 3년 전 | 1646 | ||
| 5084 | JavaScript |
DogFoot개발
|
3년 전 | 1452 | |
| 5083 | 웹서버 |
DogFoot개발
|
3년 전 | 2987 | |
| 5082 | JavaScript |
DogFoot개발
|
3년 전 | 4026 | |
| 5081 | JavaScript |
DogFoot개발
|
3년 전 | 2099 | |
| 5080 | JavaScript |
DogFoot개발
|
3년 전 | 2438 | |
| 5079 | 기타 |
DogFoot개발
|
3년 전 | 2492 | |
| 5078 | OS | 3년 전 | 1648 | ||
| 5077 | 웹서버 |
DogFoot개발
|
3년 전 | 1722 | |
| 5076 | 기타 |
DogFoot개발
|
3년 전 | 1535 | |
| 5075 | 기타 |
DogFoot개발
|
3년 전 | 1673 | |
| 5074 | 기타 | 3년 전 | 2282 | ||
| 5073 | 기타 | 3년 전 | 2553 | ||
| 5072 | 웹서버 |
 솔루션모아 |
4년 전 | 2234 | |
| 5071 | 웹서버 | 4년 전 | 3236 | ||
| 5070 | PHP | 4년 전 | 3197 | ||
| 5069 | 웹서버 | 4년 전 | 2433 | ||
| 5068 | 기타 |
 mind7 |
4년 전 | 3013 | |
| 5067 | 기타 |
DogFoot개발
|
4년 전 | 2684 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기