mulder's it blog

약간의 꼼수 .. 입니다. jQuery dialog 의 Modal 기능을 이용하여 Overlay Box를 쉽게 구현 할 수 있습니다. 일단 overlay box의 opacity를 아래와 같이 조절 합니다. .ui-widget-overlay { opacity: .30;filter:Alpha(Opacity=30); } 그리고 아래와 같이 dialog를 로딩할때 타이틀바를 숨긴다. $('div.ui-dialog-titlebar').hide()window.moveToLineDlg = $('Move To My Line').dialog({ width: "400px", minHeight: "100px", autoOpen: true, modal: true, open: function() { $('div.ui-dialo..

Query select 선택 값 확인하기 : from http://lanian.tistory.com/356 from 분류없음 jQuery로 선택된 값 읽기 $("#select_box option:selected").val(); $("select[name=name]").val(); jQuery로 선택된 내용 읽기 $("#select_box option:selected").text(); 선택된 위치 var index = $("#test option").index($("#test option:selected")); ------------------------------------------------------------------- // Add options to the end of a select $("#..

html / css/ javascript를 이용하여 image 를 toggle 시키는 기법은 다양하죠.... 개인 취향에 맞는 쉬은걸로 사용하시면 됩니다... ;) 요즘 멀더가 jQuery plugin 만들어 보는 재미가 쏠쏠해서, 이것두 하나 만들어 보았습니다. 너무 간단히 만들어서, 문제가 있을것 같은데... 혹 사용하실분은 사용해 보시고, 버그 리포트라도 해 주시기 바랍니다. 연계상품 버튼 이미지에 마우스 오버... 하면 아래와 같이 처리 * yImageToggler javascript source (function($) { // Author : mulder (@mulderu) // Version : v0.1 // When : 2013.05.22 $.fn.yImageToggler = function..

twitter bootstrap에는 깔끔한 위젯이 몇개 있는데 그중에 가장 좋은건 버튼과 탭이 아닐까 생각 합니다. 원래의 위젯 사용법 보기 :http://twitter.github.io/bootstrap/javascript.html#tabs 버튼이야 워낙 단순해서 그냥 쓰면 되는것이고, 탭으 경우 사용성이 많은데... 매번 관련 업무에 대하여 재코딩을 해야 했다.. 그래서.. 멀더가 좀 쉽게 갈 수 있도록 jQuery plugin으로 몇가지 함수를 추가 했습니다. bootStrapTab Plugin (function($) { // Author : mulder (@mulderu) // Version : v0.1 // When : 2013.05.22 $.fn.bootStrapTab = function(o)..

Web상에서 BarCode, QRCode를 만드셔야 하는 분들을 위한 좋은 자료를 공유 합니다. BAR CODE : http://barcode-coder.com/en/barcode-jquery-plugin-201.html QR-CODE : http://jquer.in/javascript-and-jquery-solutions-for-fantastic-mobile-websites/qr-code/

jQuery를 이용한 손쉬운 유틸리티 모음을 공유 합니다. 출처는 trac 입니다. (function($){ if (typeof _ == 'undefined') babel.Translations.load({}).install(); $.fn.addAnchor = function(title) { title = title || _("Link here"); return this.filter("*[id]").each(function() { $(" \u00B6").attr("href", "#" + this.id) .attr("title", title).appendTo(this); }); } $.fn.checked = function(checked) { if (checked == undefined) { // gett..

jQuery UI 작업중 가장 간단하고 많이 등장하는 division toggle 의 아주 간단한 예제입니다.실제의 경우 더욱 복잡한 경우가 다반사 이겠지만 원칙은 아래와 같다고 봅니다. New Document List Type Gallery Type List List Gallery Gallery 아래와 같이 selectbox 를 이용하여 하단 Division을 반전 시킬 수 있습니다.List div Gallery div

HTML, jQuery 관련 기술 리소스를 잘 정리한 사이트가 있군요. http://www.htmldrive.net 저도 자주 이용할 것 같아서 공유 합니다.

멀더가 가장 많이 활용하는 라이브러리가 jquery 인데, 이친구 기반 쓰기편한 widget library가 있어서 소개 합니다.이름도 참 쉽게 그냥 jqwidgets 입니다.그동안 삽질하던거 ... 손쉽게 포크레인으로 할 수 있을듯 합니다. ㅎㅎㅎ앞으로 심심할때...마다 사용법을 포스팅 해야 되겠습니다... http://www.jqwidgets.com/ 비상업적용도라면 무료로 사용할수도 있으나상업적이용은 아래의 라이센스를 사야 합니다. 가격대가 나름 착하다고 생각 합니다. 아래는 grid widget 사용 예제입니다... 보통의 widget과 사용법이 유사 합니다.관심 있으신분들은 사용해 보심이...

앞으로 jqgrid 옵션 처리를 자세히 볼 예정 임. ! var p = $.extend(true,{url: "",height: 150,page: 1,rowNum: 20,rowTotal : null,records: 0,pager: "",pgbuttons: true,pginput: true,colModel: [],rowList: [],colNames: [],sortorder: "asc",sortname: "",datatype: "xml",mtype: "GET",altRows: false,selarrrow: [],savedRow: [],shrinkToFit: true,xmlReader: {},jsonReader: {},subGrid: false,subGridModel :[],reccount: 0,lastpag..