jQuery36 jQuery hover로 이미지 변경하기 * hover로 준 결과와 같은 결과가 나옴 // $('img').bind('mouseover', function(){}) // $('img').bind('mouseout', function(){}) $('img').hover(function(){ temp = $(this).attr('src'); --> src의 속성값을 temp 변수에 저장 temp2 = $(this).attr('src2'); --> src2의 속성값을 temp2 변수에 저장 --> src의 속성값을 src2의 속성값으로 변경한다 $(this).attr('src', temp2) }, function(){ $(this).attr('src', temp); --> src의 속성값을 변경한다 }) }) 2020. 1. 14. jQuery hover 주기 $('p').mousehover(function(){}) $('p').mouseout(function(){}) --> 아래와 같이 addClass와 같은 결과가 나오지만 mousehover, moseout을 각각 줘야 한다. $('p').hover(function(){ --> 마우스 올리면 배경색 라임색 배경색 흰색 변경하면서 이벤트주기 $(this).addClass('cback'); }, function(){ $(this).css('background', 'white'); }) * addClass : 매치된 요소들의 각 집합에 지정된 css 클래스를 추가한다. 2020. 1. 14. jQuery toggle() 사용하기 $('a').on('click', function(){ --> a태그 클릭 시 div에 toggle()사용 $('div').toggle(); }) toggle() : show, hide가 번갈아가면서 이벤트 발생함 2020. 1. 13. jQuery prop-change주기 $('#all')/change(function(){ --> 전체선택 클릭 시 나머지 과일에 체크됨 all=$('#all').prop('checked'); $('.check').prop('checked', all); }) --> 전체 선택의 상태값에 따라 각 요소를 선택한다. --> 전체 선택의 change 이벤트 발생하면 --> 전체선택(id="all")의 속성값을 가져온다. = get --> class="check"인 속성값을 전체 선택의 속성값으로 변경 2020. 1. 13. jQuery Class로 css주기 2020. 1. 13. jQuery 찾기메소드(silblings-end) $('div').eq(1).css('border', '10px inset green').siblings().css('border', '7px solid navy').end().next().text('third') .end().nextAll().css('background', '#A9F5F2').end().prev().css('background', '#F5DA81'); next() --> 바로 다음 형제 nextAll() --> 뒤의 모든 형제들 prev() --> 앞의 형제 * 중간에 선택되어지고 end()를 하면 마지막으로 선택된 곳부터 실행된다. - end()로 현재 선택되어진 부분을 끝내고 그전에 선택되어진 곳에서부터 실행되게 한다. $('div').eq(1).css('border', '10px .. 2020. 1. 13. 이전 1 2 3 4 5 6 다음
