목록분류 전체보기 (50)
공부하자
웹 브라우저의 메뉴바와 툴바, 스크롤바 등이 전혀 포함되지 않은 윈도우 내부 영역 크기이다. window.innerWidth window.innerHeight 기본크기 + 메뉴바 + 툴바 영역 포함된 크기 $(window).width() $(window).height() 기본크기 + 메뉴바 + 툴바 + 스크롤바 영역이 포함된 크기 window.outerWidth window.outerHeight ex. $(document).ready(function(){ var size = $(window).width(); if(size < 760){ document.getElementById("link").setAttribute("onClick", "window.open('https://www.naver.com')")..
SSL 인증서 작업 후 http를 https 로 리다이렉트 해줘야 무조건 https로 접속이 된다. 리다이렉트 코드를 상단 header 혹은 공통 영역에 작성해준다. (둘 중 하나) 1.
참고 페이지 https://pythonq.com/so/javascript/201327 javascript - 활성 메뉴 하이라이트 CSS - IT 툴 넷 기사 출처 javascript html jquery css pythonq.com
유튜브 레이어 팝업 만드는 작업까진 어렵지 않았는데 팝업 닫을 때 문제가 생겼다.. 팝업을 닫는다고 해서 동영상이 멈추진 않음.. 당연한 소리.. 유튜브에서 지원하는 api를 이용하여 다양한 커스텀을 시도 할 수도 있고 https://developers.google.com/youtube/iframe_api_reference?hl=ko iframe 삽입에 대한 YouTube Player API 참조 문서 | YouTube IFrame Player API Embed a YouTube player in your application. developers.google.com api를 이용한 커스텀이 어렵다면 간단하게 이런 방법도 https://19park.tistory.com/35 javascript youtu..
postcode.map.daum.net/guide Daum 우편번호 서비스 우편번호 검색과 도로명 주소 입력 기능을 너무 간단하게 적용할 수 있는 방법. Daum 우편번호 서비스를 이용해보세요. 어느 사이트에서나 무료로 제약없이 사용 가능하답니다. postcode.map.daum.net 참고하여 다양한 option 값 설정, 팝업의 크기와 위치, 스타일 변경도 가능하다.
다양한 색상과 색상 조합을 랜덤으로 추천해주는 사이트 randoma11y.com/ Randoma11y Get random, accessible color combinations randoma11y.com
1. html5shiv.js : HTML5 요소를 지원하지 않는 브라우저IE 8 이하)에서 해당 요소를 지원할 수 있게 해주는 라이브러리 사용하기 : 상단 head에 해당 링크 연결 혹은 파일 다운로드 후 연결 http://code.google.com/p/html5shiv/ 2. IE9.js : IE6, IE7, IE8에서 실행되지 않는 CSS(ex.선택자)를 사용할 수 있게 해주는 라이브러리 http://code.google.com/p/ie7-js/ Google Code Archive - Long-term storage for Google Code Project Hosting. code.google.com 3. respond.js : IE 6~8 버전에서 미디어쿼리를 해석할 수 있도록 만들어주는 자바스..
참고하기 좋은 CSS 애니메이션 예제 사이트 라이브러리를 연결하여 사용하는 animation.css 기본적인 애니메이션 효과가 많아 참고하기 좋다 animate.style/ Animate.css | A cross-browser library of CSS animations. Animate.css is a library of ready-to-use, cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and attention-guiding hints. animate.style Hover 효과에 사용하기 좋은 애니메이션 효과를 모아놓은 사이트 ianlunn.github.io/Hover..
스크립트, CSS 등 동적 효과 참고 wsss.tistory.com/ @web's CSS 코드펜 레퍼런스 사이트입니다. wsss.tistory.com