맛집 여행 캠핑 일상 생활

CANVAS 이미지 그리기 예제 PC(마우스) 및 모바일(touch) 브라우저에서도 그리기가 가능한 jQuery 및 HTML 소스입니다. mousedown -> mousemove -> mouseup (좌표 : e.offsetX, e.offsetY) touchstart -> touchmove -> touchend (좌표 : e.touches[0].pageX, e.touches[0].pageY) event 가 서로 다릅니다. 터치스크린은 screenX, screenY, clientX, clientY 가 아닌 pageX Y 값에 canvas 좌표 만큼 빼줘야 합니다. 아래에서 그리기 테스트를 해보세요. 실사용이 가능한 수준으로 만들어 보았습니다. Canvas not supported 1px 2px 3px 5p..

DIV height:auto 인 경우 높이 구하기 아래 예제 처럼 div 안에 div 가 float 인 경우는 jQuery 로 높이값이 0이 나온다. 이런 경우에는 1stDIV, 2ndDIV offset().top 차이로 높이값을 구할 수가 있다. 그리고 height 가 auto 인 경우에는 background-image:url 도 먹히지 않는다. 높이 값을 구해서 height 에 값을 설정해야만 백그라운드 이미지가 나온다. div 1 div 2 div 3 div 4 div 5 div 6 div 7 div 8 dd div 1 div 2 div 3 div 4 div 5 div 6 div 7 div 8

jQuery iframe 부모 페이지 scrollTop 컨트롤하기 아래의 방식으로 핸들링하면 된다. parent.$('html body').scrollTop(0); 부모페이지 자식프레임 이렇게하면 자식 프레임이 보이는 최상단으로 스크롤링이 된다.

jQuery Element가 배열인 경우 처리 아래 예제처럼 다수의 Element 인 경우에 onmouseover 처리 방법 이미지 요소를 가져오는 방법은 id가 있으면 id로 $('#imageLayer img') id가 없다면 $('div img') 어쨌든 원하는 요소가 유니크한 것을 찾는게 제일 우선이다. div 가 없이 img 만 있다면 div 라도 덧씌워 주는게 중요하다. 가장 확실한 건 id를 지정하면 더 좋다. 배열을 한번에 처리 하는 방법 배열을 하나씩 처리 하는 방법 입맛에 맞게 처리해주면 된다.

jQuery 이미지 애니매이션 효과 주기 fadeIn, fadeOut 효과를 줘보자. 위의 이미지 중에서 아래 두개의 이미지에 마우스를 가져가 보자.

CKEDITOR 폰트 추가 및 사이즈 추가 방법 ▶ 폰트 추가CKEDITOR.config.font_names = '굴림;궁서;돋움;맑은 고딕;바탕;' + CKEDITOR.config.font_names;한글 폰트를 추가 해줄 수 있다. ▶ 사이즈 추가 (디폴트는 px로 되어 있다. 여기에 pt 도 추가)CKEDITOR.config.fontSize_sizes = '8px/8px;8pt/8pt;9px/9px;9pt/9pt;10px/10px;10pt/10pt;11px/11px;11pt/11pt;12px/12px;12pt/12pt;13px/13px;13pt/13pt;14px/14px;14pt/14pt;15px/15px;15pt/15pt;16px/16px;16pt/16pt;18px/18px;18pt/18pt;20..

자바스크립트, jQuery 로 헤더에 메타 태그 추가하는 방법 최상위 부모프레임에도 적용가능 하다. 1. jQuery 로 추가하기$('head').append(''); 2. 자바스크립트로 추가하기var meta = document.createElement('meta');meta.httpEquiv = "pragma";meta.content = "no-cache";document.getElementsByTagName('head')[0].appendChild(meta); 다른 예제var meta = document.createElement('meta');meta.name = "keywords";meta.content = "keyword1, keyword2, keyword3";document.getElement..

javascript 함수가 존재하는지 확인하는 방법 자주는 사용되지 않지만 경우에 따라(개발자의 의도에 따라) 함수가 특정 유저에게만 함수가 있는 경우도 있을 것이다.뭐 이런 경우가 아니더라도 가끔은 사용이 될 수도 있으며 이때는 typeof 를 활용하면 된다. function myFunction() {} 위의 함수가 있는지 확인하는 방법if( typeof myFunction == 'function' ) {alert('myFunction exist');}else {alert('myFunction not exist');} ▶ typeof 예제예제 결과 typeof "문자열" string typeof 1234 number typeof false boolean typeof new Array(1,2,3,4) o..

iframe 내의 자바스크립트를 호출하는 방법 부모 자식 간의 자바스크립트 호출 ▶ 키포인트부모 -> 자식 호출은 contentWindow자식 -> 부모 호출은 parent ▶ 부모 ◎ iframe -> iframe 두단계라면자식.자식.함수호출document.getElementById('frame1').contentWindow.document.getElementById('frame1').contentWindow.exam_func_child();부모.부모.함수호출parent.parent.exam_func_parent();

사이트 리디렉션(리다이렉션) 하는 방법 예전 홈페이지 주소로 유입되는 방문자를 신규 홈페이지로 이동시키고자할 때 사이트 리디렉트 처리하는 방법이다.티스토리 블로그주소를 변경하였을때 응용하면 아주 유용할 것이다. 1. 자바스크립트로 리디렉션서브도메인만 변경해서 이동시키려면 치환해서 넘겨주면된다.r_url = r_url.replace('이전서브도메인', '신규서브도메인'); 2. jQuery 리디렉션 3. 메타 태그로 리디렉션content 안에 0은 초단위이고 3초 뒤에 이동시키려면 3을 적어주면 된다. 4. PHP 리디렉션PHP는 서버단에서 처리되므로 HTTP 301 Moved Permanently status code 로 리디렉션이 가능하다. 5. .htaccess 리디렉션Redirect 301 / ht..