테스트 사이트 - 개발 중인 베타 버전입니다

[jQuery] 재밌는 제이쿼리 3

제이쿼리 이벤트에 
.bind(), .live(), .delegate() 대신 .on() 의 사용을 권고하며
.live() .die()는 jQuery 1.9 부터 빠졌습니다.
습관을 on 으로 하면 좋겠지요?

그렇다면 제이쿼리 3 번째 문제 입니다.
아래 점선내용에 on 을 사용 하여 마우스오버, 마우스아웃, 클릭  <-- 이 3가지를 on 에서 처리 되도록 하면 됩니다.

오버시 : 배경색이 red
아웃시 : 배경색이 흰색
클릭시 : 배경색이 노랑색

-----------------------------------
<span id="temp">베타테스터</span>
-----------------------------------

화이팅!!

댓글 작성

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

로그인하기

댓글 2개

$('#temp').on({
mouseenter : function() {
$(this).css({'background-color':'red'});
},
mouseleave : function() {
$(this).css({'background-color':''});
},
click : function() {
$(this).css({'background-color':'yellow'});
}
});
추가
$('#temp').on('mouseenter mouseleave click', function(event){
var bgc = '';
var types = event.type;

if(types == 'mouseenter') bgc = 'red';
else if(types == 'mouseleave') bgc = 'white';
else if(types == 'click') bgc = 'yellow';

$(this).css('background-color', bgc);
});

게시판 목록

퀴즈게시판

답을 맞히시면, 문제를 내신 회원님이 채택을 해드립니다.
채택은 '좋아요'와 같습니다.
글쓰기