jquery6 jquery hover function 사용 예 제이쿼리 이벤트 중에서 꽤 흔하게 사용되는 이벤트 메소드가 바로 hover다. 특정 엘러먼트 위에 마우스가 위치하거나 벗어났을 때의 이벤트를 정의한다. 자바스크립트의 mouseenter, mouserover를 한 번에 제어할 수 있다. CSS의 :hover 선택자를 이용한 것과 같은 이벤트를 타기 때문에, 키보드로 앵커에 위치했을 때는 동작하지 않는다. jquery hover function 사용 예 $(document).ready(function(){ //2depth menu showing when menu is collapsed var hoverMenu = $('.lnb .lnb1depth >li'); hoverMenu.hover( function () { var menuInitH = $('#menu.. 2021. 1. 18. [웹접근성] jquery checked checkbox radio 체크 유무, 선택된 값 가져오기 제이쿼리 체크박스 개수체크 소스 웹접근성을 고려한 jQuery를 활용한 체크박스와 라디오 버튼 처리 개요 이번 포스트에서는 웹 접근성을 준수하면서 jQuery를 활용하여 라디오 버튼과 체크박스를 처리하는 방법에 대해 알아보겠습니다. 웹 접근성을 고려하면서 사용자가 오류 발생 시 알림을 받고 해당 입력 폼으로 포커스를 이동시키는 방법을 예제를 통해 살펴보겠습니다. 예제 소개 오늘은 강동구립통합도서관 회원가입 페이지에서 라디오 버튼과 체크박스를 사용한 예제를 다루겠습니다. 사용자가 약관 동의와 개인정보 처리 방침 동의를 선택할 때, jQuery를 사용하여 선택 여부와 포커스 이동을 처리하는 방법을 살펴보겠습니다. 예제 코드 설명 아래는 사용된 라디오 버튼과 체크박스의 예제 코드입니다. 통합회원 구립도서관회원 작은도서관회원 회원 약관에 동의.. 2021. 1. 3. 티스토리 EGG스킨 발행날짜 변경 jquery 자바스크립트 .text(); 티스토리 EGG스킨 발행 날짜 변경 jquery 자바스크립트 왜 때문에 무엇 때문에 바꿔야 할지는 바꾸고 싶은 사람만이 알 것이지만... 나는 개인적으로 검색 결과에서 누락된 블로그의 과거에 발행했던 글이 아까워서 새로 블로그를 만들어 옮길 때가 많다. 그런데, 도저히 시점상 몇 년 된 글을 최신 글인 것처럼 올리기는 양심에 거리끼기도 한다. 검색엔진에서 최신 글로 검색이 되는 것 까지야 어쩔 수 없지만, 최소한 내 글을 볼 때는 이 글이 어 좀 오래된 글이네? 하는 정도는 알려줘야 한다고 생각되어서 이 스크립트를 종종 쓰곤 한다. 원리는 간단하다. jquery의 $('selector'). text(); 를 이용하는 방법이다. 글 중에 특정 날짜를 주고 특정 클래스를 부여한다. 클래스를 주기 싫다면, 유.. 2020. 11. 23. Jquery 스와이퍼 슬라이더 플러그인 idangerous.swiper.js pagination 스타일 변경하기 Jquery 스와이퍼 슬라이더 플러그인 idangerous.swiper.js pagination 스타일 변경하기 서론 Jquery 스와이퍼 슬라이더 플러그인인 idangerous.swiper.js를 사용하면 모바일 기기에서 손쉽게 슬라이드를 터치하여 내용을 넘길 수 있습니다. 그러나 이 플러그인의 페이징 처리 기능은 주로 숫자나 불릿 형태로 페이지를 표시하며, 텍스트 문장으로 페이지네이션을 설정하는 기능은 기본적으로 제공되지 않습니다. 이에 대한 요구사항이 있을 때, 플러그인의 코어를 수정하지 않고도 텍스트 문장을 이용한 페이지네이션을 구현할 수 있습니다. 이 글에서는 이러한 요구사항을 충족시키기 위한 해결책을 제시하고자 합니다. 해결책: 페이지네이션 텍스트 문장으로 변경하기 페이지네이션을 텍스트 문장으.. 2020. 11. 3. jQuery selector함수 slice() - start, end 까지 index 요소 일부만 선택 between jQuery selector함수 slice() - start, end 까지 index 요소 일부만 선택 between 1번부터 10번까지 형제 요소들이 있을 때 이 중에서 2번부터 5번까지만 선택해서 jquery로 동작을 시키고 싶을 때가 있다. 이럴 때 사용하는 함수가 바로 jquery slice() 메쏘드다. 즉 나열된 요소의 일부만 선택하는 선택자 메쏘드다. 사용방법 사용방법은 다음과 같다. $('selector').slice(2,5).addClass('newClass'); 이와 같이 실행하면, 선택된 요소들에서 eq(2),eq(3),eq(4),eq(5) 가 선택되어서 addClass함수에 의해 'newClass'라는 클래스명이 부여된다. 비단 클래스만 부여하는 것이 아니라 당연히 제이쿼리 제어를 .. 2020. 9. 19. 부트스트랩4 데이트피커 datepicker 이벤트 가로채기 / 제이쿼리 toggle()이용해서 게시물 목록 정렬 버튼 토글하기 부트스트랩4 데이트피커 datepicker 이벤트 가로채기 부트스트랩4 데이트피커는 아주 강력한 도구입니다. 여러 이벤트와 API를 제공하여 사용자가 원하는 방식으로 캘린더와 시간을 선택할 수 있게 해주죠. 하지만 때로는 플러그인이 제공하는 기본 이벤트가 우리의 요구사항과 완벽하게 일치하지 않을 때가 있습니다. 이럴 때 소스 코드를 직접 수정해야 하는 상황이 발생할 수 있습니다. 본 글에서는 이러한 문제를 어떻게 해결할 수 있는지 알아보겠습니다. https://tempusdominus.github.io/bootstrap-4/Events/ Redirecting to https://getdatepicker.com/ tempusdominus.github.io 기본적인 이벤트 사용법 Tempus Dominus에.. 2020. 3. 24. 이전 1 다음
