moonday

- mouseenter/leave : 요소에 마우스를 올릴때/내릴때 발생하는 이벤트 - 자손요소와 본인 요소들에 한 번만 적용, 요소를 나가기 전까지 (= hover ) - mouseover/out : 요소에 마우스를 올릴때/내릴때 발생하는 이벤트 - 본인요소와 자식 요소들에 각각에 반응 mouseenter : 0 mouseover : 0

- propagation : 요소에 이벤트가 실행되면 해당 요소에만 이벤트가 실행되는 것이 아니라 조상 요소들에도 이벤트가 실행되는 것 - stopPropagation() : 요소에 이벤트가 실행됐을 때, 조상 요소들에 이벤트가 실행되는 것을 막아주는 메소드 - 자식요소와 부모(조상) 요소에서 같은 요소를 가지고 작업을 하는 경우, stopPropagation()을 사용 box1 box2 box3

location.href = "주소" 를입력해서 click이벤트를 이용하면 페이지를 이동할 수 있음 location 예제(Daum메뉴 기능예제) 버튼

메뉴1 메뉴2 메뉴3 메뉴4 메뉴5 메뉴6 메뉴7 메뉴8 내용1 내용2 내용3 내용4 내용5 내용6 내용7 내용8 더보기 쌤코드 메뉴1 메뉴2 메뉴3 메뉴4 메뉴5 메뉴6 메뉴7 메뉴8 메뉴9 메뉴10 메뉴11 메뉴12 박스1 박스2 박스3 박스4 박스5 박스6 박스7 박스8 박스9 박스10 박스11 박스12

- each() : 요소들 각각을 불러오는 메소드 - each(function(){}): 요소들을 각각 불러와 함수 안에 있는 코드를 실행 1 2 3 체크박스 선택을 최대3개까지만 가능하도록 제한하는 예제 농구 야구 축구 볼링 태권도 테니스 수구 더보기 농구 야구 축구 볼링 태권도 테니스 수구 typeof 이해할때 참고하기 : https://www.codingfactory.net/10288

롤링예제(가로) 박스1 박스2 박스3 박스4

rolling.js => 롤링기능 모아놓은 파일 function rollingTop(list, listItem, marginTop, animateTime, intervalTime){ var id = setInterval(function(){ if(!$(list + ' ' + listItem).first().is(':animated')){ //가아니면 $(list + ' ' + listItem).first() .animate({'margin-top':marginTop+'px'},animateTime,function(){ $(this).detach().appendTo(list).removeAttr('style'); }) } },intervalTime) return id; } function rollingLe..

- scroll() : 요소에 마우스 스크롤을 할 떄 발생하는 이벤트 - scrollTop() : y축 방향으로 스크롤의 위치 - scrollLeft() : x축 방향으로 스크롤의 위치

- detach() : 요소를 뗀다(속성과 이벤트 정보를 유지) - 요소를 떼기만하면 제거랑 같은기능(remove) - 보통은 요소를 떼서 다른 곳에 붙일 때 사용 - is('') : ~인지 아닌지 확인하여 ~이면 true, 아니면 false 반환 - :animated, : checked, :eq(1) 을 보통 함께 사용해서 같이쓰는 것들의 상태를 확인 - 마우스를 요소 위에 댔을 때와 벗어났을 때 같은 함수를 실행 hover(function(){ }) - 마우스를 요소 위에 댔을 때와 벗어났을 때 다른 함수를 실행 hover(function(){ //마우스를 요소 위에 댔을 때 }, function(){ }) //마우스가 요소 위에서 벗어났을 때 - removeAttr('속성명'): 해당 속성값을 삭제..