jquery 활용해 버튼클릭시 레이어창이 뜨고 다른 배경 클릭할때 뜬 레이어 창 닫게 하는

게시글

배경을 클릭했을때 레이어 창이 닫히는 소스

jquery로 작업하였습니다 버튼에는 class="​c_layer_menu_btn" 선언해주고 메뉴에는 class="c_layer_menu​" 선언해줘야 합니다 menu1 //배경클릭시 메뉴가 사라지는 함수 $(document).on("click", function(e) { if (!$(e.target).closest(".c_layer_menu, .c_layer_menu_btn").length) { $(".c_layer_menu").hide(); } });

게시글

팝업창 옆에 팝업창 띄우기

팝업창을 띄울때 top,left는 고정되는데 상대적인 위치에 팝업창을 띄우고자 할때 사용하는 방법 var nWidth = "260"; var nHeight = "430"; // 듀얼 모니터인경우 var curX = window.screenLeft; var curY = window.screenTop; var curWidth = document.body.clientWidth; var curHeight = document.body.clientHeight; var nLeft = curX + (curWidth / 2) - (nWidth / 2); var nTop = curY + (curHeight / 2) - (nHeight / 2); var strOption = ""; strOption += "left=" + nLeft + "px,"; strOption += "top=" + nTop + "px,"; strOption += "width=" + nWidth + "px,"; strOption += "height=" + nHeight + "px,"; strOption += "toolbar=no,menubar=no,location=no,"; strOption += "resizable=yes,status=yes"; window.open(src, '', strOption);

jquery

jquery.com

jquery을 소개합니다. jquery는 자바스크립트를 편리하게 사용할수 있도록 만들어진 라이브러리 입니다. jquery의 장점은 가장 많이 사용되는 자바스크립트 라이브러리 중 하나 라는 것입니다. 다이나믹한 웹페이지를 제작하기 위해 자바스크립트는 필수 입니다. 물론 CSS나 플래시 등을 통해서 구현 가능하지만 기본적으로 다이나믹한 웹페이지를 위해서는 자바스크립트를 사용합니다. 그러나 만들순 있지만 쉽게 구현하기는 어렵습니다. 그래서 쉽게 만들수 있도록 jquery를 사용합니다. 사용이 간편하고 효과가 좋아 아주 많은 사람들이 사용하고 있습니다. 사람들이 많이 사용하는 것은 그만한 이유가 있습니다. 저 역시 jquery를 많이 사용합니다. 해당 사이트에서는 사용할수 있는 방법 api가 제공되고 https://api.jquery.com 이미 만들어진 plugin도 존재하여 더욱 쉬운 사용을 도와줍니다. https://plugins.jquery.com 메뉴구성은 Dowload, API Documentation, Blog, Plugins, Browser Support등으로 구성되어 있어 다양한 서비스를 이용할 수 있습니다 jquery는 홈페이지뿐 아니라 트위터등의 채널을 통해 고객들과 더 많이 소통하려 노력하고 있습니다. 자세한 정보를 원하신다면 https://jquery.com 주소를 참고 하시면 더많은 정보를 확인 하실 수 있습니다.

게시글

안드로이드 백버튼 클릭할때 앱종료하는 소스

안드로이드폰에서 뒤로가기 클릭했을때 이벤트 device 플러그인에 포함되어 있다고 생각된다 아래는 backbutton 리스너를 통해서 앱을 종료하는 소스이다 //뒤로가기 버튼 클릭시 document.addEventListener("backbutton", function(){ if(confirm("앱을 종료 하시겠습니까?")){ navigator.app.exitApp();//프로그램종료 } }, false); 앱을 백그라우드로 넘기는 방법은 없을까 하고 여러가지를 찾아보았지만 난 찾지 못했다 ㅠㅠ 참고적으로 내가 찾은 navigator.app 함수들이다 navigator.app.backHistory(); navigator.app.cancelLoadUrl(); navigator.app.clearCache(); navigator.app.clearHistory(); navigator.app.exitApp(); navigator.app.loadUrl(url, props); navigator.app.overrideBackbutton(override); 몇가지는 테스트 해보았으나 몇가지는 테스트 해보지 안았다 ​

게시글

display가 none인지 display인지 알아내는 방법

jquery로 dispaly의 보여진 상태인지 감추어진 상태인지 알기위해서 여러가지 방법이 있다 그러나 나는 아래와같은 방법을 즐겨사용한다 $("#아이디").css("display") css()함수를 사용해서 none인지 block인지를 구분해서 처리한다

jquery

jqueryui.com

jquery을 소개합니다. jqueryui는 jquery의 API 뿐아니라 다양한 UI 데모와 소스를 제공해 쉽게 jquery를 사용할수 있게 만든 사이트 입니다. jquery의 장점은 UI이 데몬 소스를 제공한다는 것입니다. jquery를 처음 접하면 어떠한 프로그램인지, 뭘 할수 있는지 모르는 경우가 많습니다. 그러나 해당 사이트에서는 jquery 만들어진 UI이 데몬을 통해 직관적으로 기능을 파악할수가 있습니다. 예를 들어 Droppable 메뉴를 클릭하면 드래그 드롭 관련 UI이가 있어 직접 테스트를 해볼수 가 있습니다 UI이 하단에는 view source 소스보기가 있어 소스를 파악할수 있고 API documentation 버튼이 있어 API를 활용해 소스를 분석및 수정할수 있습니다. 메뉴구성은 Demos, Download, API Documentation, Themes, Development, Support등으로 구성되어 있어 다양한 서비스를 이용할 수 있습니다 jquery 관련 UI이가 궁금하시다면 jqueryui를 적극 활용해 보시기 바랍니다. 자세한 정보를 원하신다면 https://jqueryui.com 주소를 참고 하시면 더많은 정보를 확인 하실 수 있습니다.

게시글

마우스 오버시에 메뉴를 노출하는 jquery소스이다

var top_sub_menu="";//메뉴 유지하기위한 변수 타이틀 서브메뉴

웹상에서 화면 캡쳐하는 플러그인

html2canvas.hertzen.com

포토샵과 같은 응용프로그램으로 화면을 캡쳐하는것이아닌 웹상에서 웹화면을 캡쳐하는 방법입니다 자바스크립트를 활용한 방법이기 때문에 브라우저 내부화면만 캡쳐가능한 단점은 있지만 웹상에서 캡쳐하여 이미지로 저장할수있다는 점은 활용도가 아주 높은 기술입니다 이미지 편집할때 화면 합성과 같은 곳에 아주 유용하게 사용할수 있습니다