HOME
HOME
제이쿼리(jQuery) - 이미지 온, 오프하기
이미지 온, 오프하기 제이쿼리를 사용하여 이벤트시 이미지의 경로를 바꾸는 방법 - img의 attr(src)를 replace한다. 코드 $(function() { var obj = $('.tab img'); $('.tab img').on('click', function(){ $('.tab img').each(function(){ $(this).attr('src', $(this).attr('src').replace('_on.gif', '_off.gif')); }); $(this).attr('src', $(this).attr('src').replace('_off.gif', '_on.gif')); }); });
제이쿼리(jQuery) - 순차적으로 활성화 시키기
셋인터벌(setInterval) 유용하게 사용할 수 있는 제이쿼리 코드'셋인터벌'사용하여 순차적으로 활성화 시키기 스크린샷 관련코드 $(function(){ var idx = 0; setInterval(time, 1000); function time(){ var box = $('li'); box.removeClass('on'); box.eq(idx).addClass('on'); idx++; if(idx >= box.length) idx= 0; } }); 예제 See the Pen setInterval - 순차적 활성화 by mansu (@mansunii) on CodePen.
제이쿼리(jQuery) - 탭메뉴 (tabmenu)
기본 탭메뉴 실무에서 기본적으로 많이 사용되는 기본적인 탭메뉴 웹접근성시에는 마크업이 달라지므로 유의해서 사용해야 한다. 스크린샷 코드 $('.tab-menu a').on('click', function(){ var a = $(this); var idx = a.index(); var box = a.closest('.tab-area'); box.find('.hidden-area').removeClass('on'); box.find('.tab-menu a').removeClass('on'); box.find('.hidden-area:eq('+idx+')').addClass('on'); a.addClass('on'); return false; }); 예제 See the Pen Tab-Menu by mansu ..
VS Code - 자주사용하는 단축키 (for MAC)
Latest Version 💻 - MAC : Ventura 13.0 - Visual Studio Code : 1.73.0 단축키 ⌘ + D : 같은 단어 선택 (길게누르면 여러개 선택 가능) ⌘ + ⇧+ L : 같은 단어 전체 선택 ⌘ + X : 행 잘라내기 ⌘ + ⌫ : 현재 커서 위치부터 줄 맨앞까지 삭제 ⌘ + ⇧ + K : 행 삭제 ⌘ + ⇧ + ↑ , ↓ : 커서부터 최상단, 최하단까지 선택 ⌘ + ⇧ + ← , → : 커서부터 맨앞, 맨뒤 까지 선택 ⌘ + ⇧ + enter : 윗줄에 행 삽입 ⌘ + Enter : 아랫줄에 행 삽입 ⌘ + ] : 들여쓰기 ⌘ + [ : 내어쓰기 ⌘ + ⌥ + [ : 영역 접기 ⌘ + ⌥ + ] : 영역 펼치기 ⌘ + / : 주석 ⌥ + ⇧ + A : 선택영역 ..
100% 레이아웃 잡는 방법
100% 레이아웃 기본적으로 제일 많이 사용하고 있는, 컨텐츠가 없어도 푸터가 하단에 고정되는 100% 레이아웃 잡는 방법 스크린샷 코드보기 css html, body { width:100%; height:100%; margin:0; padding:0; } header { position:relative; z-index:2; width:100%; height:80px; } .container { position:relative; z-index:1; min-height:100%; margin:-80px auto -200px; padding:80px 0 200px; } footer { clear:both; position:relative; z-index:2; width:100%; height:200px; }..
맥에서 네이버 캘린더 연동
네이버 캘린더 연동 맥오피스에서 네이버 캘린더를 연결하면 기본 캘린더에 네이버 캘린더 스케쥴이 공유되어 나와 편리하다. 1. 환경설정 열기 캘린더 > 환경설정 2.계정 추가 하기 계정 > 추가(+)버튼 다른계정 선택 후 계속 3.계정 옵션 입력하기 계정 유형 > 고급 사용자이름 : 네이버 아이디 암호 : 네이버 비밀번호 서버 주소 : caldav.calendar.naver.com 서버 경로 : /principals/users/네이버아이디 포트 : 443 SSL 사용 체크 하지만, '네이버 2단계 인증'을 해놓았다면 '계정 이름 또는 암호를 확인할 수 없습니다.'라는 메시지가 나옵니다. 4.네이버 인증하기 네이버 앱 > 내정보 > 보안설정 > 2단계 인증 > 관리하기 5.비밀번호 생성 종류 > 아이폰 > ..
맥, 윈도우에서 한글 무료로 사용하기
Prolog 한컴스페이스에서 제공해주는 무료 서비스가 '한컴독스'로 리뉴얼되면서 구독형으로 바뀌었다. 자주 사용하지는 않지만 없으면 또 불편한 한글... 가끔 한글 프로그램을 사용 해야하는데 구매하기는 조금 부담스러울 때 사용하면 너무 좋다!! 사용방법 보기 웹사이트 접속 한컴 독으로 바로 들어가서 로그인을 합니다. https://www.hancomdocs.com/ 무료버전도 지원을 해주고 있다..(감동) 웹/모바일에서는 문서 편집도 가능하고, 다운로드해서 설치하면 읽기만 가능하다. 첫화면 바뀌기전 한컴스페이스에서 저장해논 문서도 그대로 있다..!! 계정정보 확인 무료버전으로 되어있다 ^ -^ 한컴독스 사이트 바로가기 https://www.hancomdocs.com/ 한컴독스 – 한글과컴퓨터의 구독형 한..
iOS - System Color
iOS System Color 시스템 기본컬러 예) UIColor.Label Name Light Mode Dark Mode label secondaryLabel tertiaryLabel quaternaryLabel systemFill secondarySystemFill tertiarySystemFill quaternarySystemFill placeholderText systemBackground secondarySystemBackground tertiarySystemBackground systemGroupedBackground secondarySystemGroupedBackground tertiarySystemGroupedBackground separator opaqueSeparator link dar..
Udemy - 구글 번역 이용하여 한글 자막 보기
유데미에서 구글 번역 이용하여 한글 자막 보기 ✻ 준비물 : 구글 크롬 [다운받기] 1. 페이지 언어를 "영어"로 변경한다. - 한국어로 설정되어 있으면 번역기능이 작동이 안한다. 2. "Transcript" 활성화 3. "강의자막" 활성화 4. 주소창 옆에 번역하기 -> 한국어 5. "F12" 개발자도구 -> "Console" 탭 열고, 아래 코드를 붙여넣기 하고 엔터 if(typeof window.i!=='undefined'){clearInterval(window.i)}else{let lastText='';function check(){let toEl=$('.well--container--2edq4 span');let fromEl=$('p[data-purpose="transcript-cue-activ..
맥(Mac) - 스크린샷
스크린샷 MAC에서 화면 스크린샷 ScreenShot 캡쳐 Capture 하기 전체 화면 캡쳐 - ⌘ + Shift + 3 화면 일부를 캡쳐 - ⌘ + Shift + 4 윈도우 또는 메뉴를 캡쳐 - ⌘ + Shift + 4 + SpaceBar 스크린샷 열기 - ⌘ + Shift + 5 터치바 캡쳐 - ⌘ + Shift + 6 그림자없이 찍는 방법 '⌘ + Shift + 4 + SpaceBar' 누른 후 창을 선택하는 과정에서 '⌥(Option)' 키를 함께 눌러 주면 된다. 터미널에서 설정값 수정하는 방법 그림자제거 defaults write com.apple.screencapture disable-shadow -bool true 원상복구 defaults write com.apple.screencaptu..