티스토리 뷰
부정연산자를 이용해 토글을 사용한 반복 애니메이션
메서드에 축약형으로 다음과 같이 사용하거나 아니면 직접 구현해 줄 수 도있다.
결과는 똑같지만 표현 방식만 미세하게 다르다.
퍼포먼스및 메모리 체크는 해보지 않았지만 척봐도 직접 구현형이 축향형 보다는 좀더 할당을 받을것 같다.
소스
<!DOCTYPE HTML>
<html lang="ko">
<head>
<title> NewDocument </title>
<meta charset="utf-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>
<body>
<img src='test.png' />
<img src='test.png' />
<script>
var obj = jQuery('body').children().eq(0);
var now = false;
var arr = [{'opacity':0}, {'opacity':1}];
// 축약형
var Loop = setInterval(function(){
obj.stop().animate( arr[ +(now=!now) ], 500 );
},2000);
// 직접구현형
var obj2 = jQuery('body').children().eq(1);
var Loop2 = setInterval(function(){
obj2.stop().animate( arr[ toggle() ], 500 );
},2000);
var bool;
function toggle(){
bool = !bool;
if(bool){
return 1;
}else{
return 0;
}
}
</script>
</body>
</html>
결과
'■ 프론트엔드 ■ > JavaScript' 카테고리의 다른 글
| 폼데이터 - 부모창에서 팝으로 submit (0) | 2014.02.26 |
|---|---|
| 새로고침 방지 샘플 스크립트 (0) | 2014.02.19 |
| 정규식 한글 체크 (1) | 2014.02.10 |
| 브라우저 종류 판별 (2) | 2014.01.24 |
| indexOf - String개체안에서 부분 문자열이 처음 나오는 문자 위치 반환 (0) | 2014.01.24 |
댓글