.delay (duration [, queueName])

수다왕

· 8년 전 · 조회 1771 1771

설명 : 큐에있는 후속 항목의 실행을 지연하도록 타이머를 설정합니다.

.delay()메서드는 큐에서 그 뒤에 오는 함수의 실행을 지연시킬 수 있습니다. 표준 효과 대기열 또는 사용자 정의 대기열과 함께 사용할 수 있습니다. 대기열의 후속 이벤트 만 지연됩니다. 예를 들어이됩니다 하지 의 노 인수 양식을 지연 .show()또는 .hide() 이는 효과 큐를 사용하지 마십시오.

기간은 밀리 초 단위로 표시됩니다. 값이 높을수록 느린 애니메이션이 아니라 빠른 애니메이션이 표시됩니다. 문자열 'fast'과는 'slow'각각 200, 600 밀리 초의 지속 기간을 나타 내기 위해 제공 될 수있다.

표준 효과 큐를 사용하여, 우리는 예를 들면, 사이에 800 밀리 초 지연을 설정할 수 .slideUp()와 .fadeIn()의를 <div id="foo">:

$( "#foo" ).slideUp( 300 ).delay( 800 ).fadeIn( 400 );

이 명령문이 실행되면 요소는 300 밀리 초 동안 슬라이드 한 다음 800 밀리 초 동안 일시 정지 한 후 400 밀리 초 동안 페이드 인합니다.

이 .delay()방법은 대기중인 jQuery 효과를 지연시키는 데 가장 좋습니다. 제한적이기 때문에 (예를 들어, 지연을 취소하는 방법을 제공하지는 않음) .delay()JavaScript의 기본 setTimeout 함수를 대체하는 것이 아니며 특정 유스 케이스에 더 적합 할 수 있습니다.

예:

두 div의 숨기기 및 표시를 애니메이션으로 표시 한 다음 첫 번째 표시를 지연 한 다음 표시합니다.

<!doctype html>

<head>

<title>delay demo</title>

<style>

div {

position: absolute;

width: 60px;

height: 60px;

float: left;

}

.first {

background-color: #3f3;

left: 0;

}

.second {

background-color: #33f;

left: 80px;

}

</style>

</head>

<body>

$( "button" ).click(function() {

$( "div.first" ).slideUp( 300 ).delay( 800 ).fadeIn( 400 );

$( "div.second" ).slideUp( 300 ).fadeIn( 400 );

});

</script>

</body>

</html>

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시판 목록

개발자팁

개발과 관련된 유용한 정보를 공유하세요.
질문은 QA에서 해주시기 바랍니다.

글쓰기

번호	분류	제목	글쓴이	날짜	조회
5396	기타	게시글 스팸방지 방법 중 하나 구글 - reCAPTCHA	슈퍼스타맨 프로필 보기 이 회원 글보기 이 회원의 댓글보기	4개월 전	349
5395	PHP	아이피 위치추적 (ISP 위치 정보) [2]	untitled 프로필 보기 이 회원 글보기 이 회원의 댓글보기	5개월 전	822
5394	MySQL	웹 느릴 때 꼭 해보는 DB 쿼리 로그 팁 공유합니다 [1]	선택과집중 프로필 보기 이 회원 글보기 이 회원의 댓글보기	5개월 전	593
5393	웹서버	url에 타 도메인을 지정할 수 없습니다. [3]	techstar 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8개월 전	861
5392		pdf.js 사용 오류에 대한 사항 모듈 문제 [3]	oneit 프로필 보기 이 회원 글보기 이 회원의 댓글보기	1년 전	1217
5391		음악에 맞게 가사의 색상변경 [5]	김철용 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10개월 전	1117
5390		vscode가 열릴 때 느리신 분은 한번 해보셔요. [2]	xpem 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10개월 전	904
5389		SVG 아이콘을 쉽게 사용하기 [5]	메이드 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9개월 전	874
5388		오늘의 조언 한마디 script [5]	케빈엉클 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8개월 전	974
5387		jquery loaded 커스텀 함수	세크티 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8개월 전	807
5386	JavaScript	한글과컴퓨터 키워드추출스크립트. [2]	nekoieye 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8개월 전	971
5385	웹서버	사이트 접속을 국내 아이피에만 허용하는 코드를 만들어 봤습니다. [4]	이나라왕 프로필 보기 이 회원 글보기 이 회원의 댓글보기	8개월 전	989
5384	JavaScript	위에서 아래로 내려오는 효과 6가지	수평선1203 프로필 보기 이 회원 글보기 이 회원의 댓글보기	9개월 전	815
5383	기타	groq api 용량 부족할 때 [5]	Tak2 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10개월 전	1127
5382	기타	css translate,rotate,scale 은 항상 순서가 고정입니다.	수평선1203 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10개월 전	575
5381	JavaScript	마우스로 td 간격 조정하기. [1]	하얀감자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10개월 전	905
5380	기타	python 공유 메모리 [1]	지구인430 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10개월 전	689
5379	JavaScript	엘레먼트에 다이렉트로 변수,배열,객체 심기	비타주리 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10개월 전	689
5378		심플한 게시판 테마 [5]	김철용 프로필 보기 이 회원 글보기 이 회원의 댓글보기	10개월 전	1198
5377	기타	x 모양 이모지 모음입니다.	수평선1203 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11개월 전	760
5376	jQuery	0원팁- 숫자형 아이디에 접근하기 [1]	수평선1203 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11개월 전	574
5375	jQuery	유용하게 써먹는 반응형 grid [1]	techstar 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11개월 전	728
5374	기타	어울리는 색상표 사이트 입니다.	수평선1203 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11개월 전	777
5373	MySQL	db에서 트리거 만들기	wodud3073 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11개월 전	808
5372	기타	사용하지 않는 css 보는 사이트입니다. [1]	수평선1203 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11개월 전	1013
5371	JavaScript	디바운스 debounce의 개념 [1]	wodud3073 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11개월 전	726
5370	JavaScript	jquery 타이머 만들기 [2]	wodud3073 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11개월 전	729
5369	PHP	특정 환경에서 php 함수내용을 뜯어보기 [3]	wodud3073 프로필 보기 이 회원 글보기 이 회원의 댓글보기	11개월 전	1243
5368	PHP	PHP가 없는 환경에서 PHP 라이브러리 호출하기 [4]	어둠사자 프로필 보기 이 회원 글보기 이 회원의 댓글보기	1년 전	1408
5367	기타	[엑셀라이브러리] 간단한 식자재 사용량 계산기 HTML [3]	nekoieye 프로필 보기 이 회원 글보기 이 회원의 댓글보기	1년 전	1283