2010년 9월 17일 금요일

[Javascript] 파일 upload 전 확장자 / 이미지 크기 체크


  <input type="file" name="fileName" onChange="uploadImg_Change( this, 480,320 )" alt="480*320" >



function fileClear(obj){
obj.select();
document.selection.clear();
obj.blur();
}
function getFileExtension( filePath )
{
    var lastIndex = -1;
    lastIndex = filePath.lastIndexOf('.');
    var extension = "";

if ( lastIndex != -1 )
{
extension = filePath.substring( lastIndex+1, filePath.len );
} else {
extension = "";
}
    return extension;
}

//파일을 선택 후 포커스 이동시 호출
function uploadImg_Change( obj, iwidth, iheight )
{
var value = obj.value;
maxImageHeight=iheight;
maxImageWidth=iwidth;
    var src = getFileExtension(value);
    if (src == "") {
//        alert('올바른 파일을 입력하세요');
fileClear(obj);
        return;
    } else if ( !((src.toLowerCase() == "gif") || (src.toLowerCase() == "jpg") || (src.toLowerCase() == "jpeg")) ) {
        alert('gif 와 jpg 파일만 지원합니다.');
fileClear(obj);
        return;
    }

    LoadImg( obj);

}
function LoadImg(obj)
{
var value = obj.value;
    var imgInfo = new Image();
//    imgInfo.onload = img_Load;
    imgInfo.src = value;
var imgWidth = imgInfo.width;
var imgHeight = imgInfo.height;
if(imgWidth != maxImageWidth || imgHeight != maxImageHeight){
alert(maxImageWidth+"*"+maxImageHeight+"파일만 지원합니다");
fileClear(obj);
return false;
}
}

[Javascript] input type=file 값 초기화

<input type=file name=aaa>

function fileClear(obj){
obj.select();
document.selection.clear();
obj.blur();
}

폼 기본값 넣기

$(document).ready(function() {
   $('input[type=text]').focus(function() {
      if($(this).val() == $(this).attr('defaultValue')) {
         $(this).val('');
      }
   })
   .blur(function() {
      if($(this).val().length == 0) {
         $(this).val($(this).attr('defaultValue'));
      }
   });
});

위와 같은 코드를 넣어 주고.. 아래와 같은 코드를 사용하시면됨..

<input type="text" value="입력해주세요." />

disable/enable 전환



$(selector).disable(), $(selector).enable()

2010년 9월 16일 목요일

양육비...흠...

지원 받을 수 있으려나....ㅡ,.ㅡ;;

==================================
정부가 내년부터 일부 고소득층을 제외한 모든 서민·중산층 가정의 보육비를 책임지겠다고 나서면서 보육료 혜택 범위에 대한 관심이 커지고 있다.

테마가 있는 뉴스Why뉴스최승진 포인트 뉴스'25년차' 대기업 팀장, 수백억대 '핵심기술' 빼돌린 까닭"드로잉, 작가의 마음을 닮은 미술"손숙·허수경…연극 '엄마를 부탁해'정부는 16일 월 소득이 450만원 이하(4인가구 기준)인 서민·중산층이 보육 시설을 이용할 때 내년부터 보육료 전액(0-5세)을 지원키로 했다고 밝혔다.

올해의 경우 76만명의 영유아가 보육료 전액지원을 받았지만 내년에는 91만6천명으로 늘게된다. 전체 보육 가정의 70%가 보육비 지원의 수혜를 입게 될 것으로 보인다.

또 맞벌이 가구(4인가구 기준)에 대한 무상보육 지원대상을 월 소득 498만원에서 600만원으로 대폭 확대했다.

보육시설을 이용하지 않을 경우 지급하는 양육수당도 0-2세까지로 대상을 확대하고, 지원규모도 월 10만원에서 최대 20만원으로 인상했다.

하지만 월소득이 450만원 이하라 하더라도 누구나 지원받을 수 있는 것은 아니다. 정부가 밝힌 기준이 흔히 생각하는 것처럼 월급 기준이 아니라 '소득인정액' 기준이기 때문이다. 관련기사
이 대통령 "서민층 보육비, 전액..아동 보육비 5년 전보다 24% 증가

소득인정액은 실제소득인 월 소득에 일반재산, 금융재산 등을 월평균 소득으로 환산한 급액을 합산해 계산한다.

즉, 집도 있고 차도 있는 가정의 경우 월 소득이 450만원 이하더라도 무상보육 기준인 소득인정액은 초과되기 때문에 지원을 받을 수 없다.

보건복지부 관계자는 "각 가정의 소득인정액은 재산 정도에 따라 다를 수밖에 없기 때문에 지원 대상에 해당되는지 여부는 주민센터(동사무소)에 가서 신청을 하고, 재산조회를 해봐야 알 수 있다"고 말했다.

해당 가정의 소득인정액이 450만원 이하인지를 확인하고 싶으면 관련 서류 등을 지참해 주민센터에 가서 보육료 지원 신청을 해야 한다.

주민센터는 해당 가정에 대한 재산조회를 실시한 후 월 소득 기준에 해당하는 것이 확인되면 아이사랑 카드를 지급한다.

2010년 9월 15일 수요일

2010년 9월 14일 화요일

SELECT 값 유지하는 방법

게시판에서 검색기능 등을 사용할때..

<SELECT>
     <OPTION>제목</OPTION>
     <OPTION>내용</OPTION>
     <OPTION>제목+내용</OPTION>
</SELECT>

SELECT값을 계속 유지하고 싶을때 사용..

$("#kind > option[value='선택한값']").attr("selected","selected");

[clockpick]시간 설정

<link rel="stylesheet" href="/inc/css/jquery.clockpick.1.2.7.css" type="text/css">
<script type="text/javascript" src="/inc/js/jquery.clockpick.1.2.7.js"></script>

        $("#viewTime").clockpick();
        $(".clockpick").clockpick({
            valuefield : 'viewTime'
            });

참고 : http://www.oakcitygraphics.com/jquery/clockpick/trunk/ClockPick.cfm

JQuery Link

--JQuery 관련 링크 모음 (얼마나 될지 모름..)
출처 : http://www.cyworld.com/mengwi/2741267
jQuery Grid Plugin (***) : 게시판에서 정렬과 게시판 펼치기 접기 등의 기능을 도와주는 플러그인http://www.trirand.com/blog/?page_id=6 
 
그리드 (*) : 전체 페이징을 하지 않는 Ajax 게시판http://www.reconstrukt.com/ingrid/example2.html

 
 
팬시박스 (**) : 이미지 팝업창에 모달효과 약간의 에니메이션이 들어감.http://fancy.klade.lv/ (****)
예제 : http://fancy.klade.lv/example
 
jQuery Lightbox Plugin (balupton edition) (**) : 이미지 모달 팝업http://www.balupton.com/sandbox/jquery_lightbox/
 
imagebox : 이미지 모달 팝업http://www.intelliance.fr/jquery/imagebox/
 
이미지 회전 :  이미지의 회전이 가능하게 한다.
http://www.piksite.com/mRotate/mRotate.html
 
jQuery sliding gallery demo : 이미지 애니메이션 슬라이드 http://phplug.net/components/javascript/jquery-gallery.html
 
이미지 슬라이딩 : 좌 우로 움직임http://www.maxb.net/scripts/ycodaslider-2.0/include/demo/#10
 
이미지 공간감 효과 (***)  :  여러 이미지를 레이어 겹쳐 놓음으로써 3D 효과를 준다. 
http://webdev.stephband.info/parallax.html
 
디자이너를 위한 jquery (**) : 태그 조작과 에니메이션 효과와 관련된 사이트http://www.webdesignerwall.com/demo/jquery/(****)
 AutoScroll (*) : 컨트롤 키 누른 채로 mouse 움직였을 때, 자동 스크롤이 가능하게끔http://jdsharp.us/jQuery/plugins/AutoScroll/demo.php (****)
 drag and drop (*) : 드래그 드랍 예제http://host.sonspring.com/dragdrop/ (***)
 
JQuery 예제 모음 사이트 (*****) 
http://www.ajaxrain.com/tag?tag=jquery 
 컬럭 Picker (****)  :  PhotoShop의 색 선택 기능이 가능.http://www.intelliance.fr/jquery/color_picker/

 jQuery MultiSelect (**) : custom 셀렉트 박스, 셀렉트 박스에 체크박스가 추가 되어 여러개를 선택 가능한 박스.http://abeautifulsite.net/notebook_files/62/demo/jqueryMultiSelect.html

 "jQuery checkbox v.1.0.0" demo (**)  : custom 디자인 체크박스http://widowmaker.kiev.ua/checkbox/
 
jQuery Treeview Plugin Demo (**) : 트리 컨트롤러 1
http://jquery.bassistance.de/treeview/demo/
 
jQuery File Tree Demo (***) : JQuery 트리 컨트롤로 2http://abeautifulsite.net/notebook_files/58/demo/
 
jQuery columnManager plugin (*) : 테이블의 컬럼을 추가 삭제등의 기능 제공http://p.sohei.org/stuff/jquery/columnmanager/demo/demo.html
jQuery AIR (***) : ajax를 이용한 항공 좌석 예약.http://www.digital-web.com/extras/jquery_crash_course/
Masked Input Plugin (**) : 입력상자에 exel과 같은 서식 적용.http://digitalbush.com/projects/masked-input-plugin

Watermark Input Plugin (*): 입력상자에 워터마크 표시http://digitalbush.com/projects/watermark-input-plugin
 
ClockPick (***): 입력상자에 시간을 선택해서 넣을 수 있다.http://www.oakcitygraphics.com/jquery/clockpick/trunk/ClockPick.cfm
chart : JQuery를 이용한 차트 http://www.reach1to1.com/sandbox/jquery/jqchart/

 
달력 http://tedserbinski.com/jcalendar/index.html#demo
 
3D로테이션 : 글자들이 xy 좌표에서 3D효과로 회전함.http://www.willjessup.com/sandbox/jquery/rotator/rotator.html
스크롤중 데이터가져오기 : http://www.webresourcesdepot.com/dnspinger/http://www.webresourcesdepot.com/load-content-while-scrolling-with-jquery/
Query Flash Plugin - Basic Example : flash 삽입 플러그인http://jquery.lukelutman.com/plugins/flash/example-basic.html
 jquery combobox demo : custom 콤보박스 ie 7.0으로 보면 깨져나온다.
http://jquery.sanchezsalvador.com/samples/example.htm
scrollable table : 테이블에 스크롤바가 붙어있다-_-;;http://www.webtoolkit.info/demo/jquery/scrollable/demo.html
 
accordion-madnesshttp://www.learningjquery.com/2007/03/accordion-madness
 
jQuery Multimedia Portfoliohttp://www.openstudio.fr/jquery/
 
체크박스 이동http://sanisoft-demo.com/jquery/plugins/shiftcheckbox/demo.html
위지윅에디터http://projects.bundleweb.com.ar/jWYSIWYG/
크랍http://remysharp.com/2007/03/19/a-few-more-jquery-plugins-crop-labelover-and-pluck/#crop
슬라이딩 퍼즐http://www.bennadel.com/blog/1009-jQuery-Demo-Creating-A-Sliding-Image-Puzzle-Plug-In.htm
 
날짜픽업http://kelvinluck.com/assets/jquery/datePicker/v2/demo/
레이팅http://php.scripts.psu.edu/rja171/widgets/rating.php
JQuery Curvy Corners Demo pagehttp://blue-anvil.com/jquerycurvycorners/test.html
 
줌http://www.mind-projects.it/blog/jqzoom_v10
 
LavaLamp for jQuery lovers!http://gmarwaha.com/blog/?cat=8
 
컬러http://www.jnathanson.com/blog/client/jquery/heatcolor/index.cfm#examples
 
비쥬얼 쿼리http://visualjquery.com/1.1.2.html
 
jQuery "Highlight" Demohttp://www.keyframesandcode.com/resources/javascript/jQuery/demos/highlight-demo.html
 
 
Hot Key Testinghttp://jshotkeys.googlepages.com/test-static.html
 
 
accordion menuhttp://www.i-marco.nl/weblog/jquery-accordion-menu-redux/
 
jQuery easyThumbhttp://www.hverven.net/div/easyThumb/
갤러리http://www.flyerstop.ca/ui/apps/gallery_advanced/
 
thickboxhttp://jquery.com/demo/thickbox/
 
마우스휠 플러그인http://www.ogonek.net/mousewheel/jquery-demo.htmlhttp://www.ogonek.net/mousewheel/demo.html
휴먼메세지http://binarybonsai.com/misc/humanmsg/
 
jQuery - LinkedSelecthttp://www.msxhost.com/jquery/linked-selects/json/
 
jQuery » iFrame Sizing http://host.sonspring.com/iframe/
jQuery for Designers - Ajax Form Validation Examplehttp://jqueryfordesigners.com/demo/ajax-validation.php
폰트크기 바꾸기http://www.lllcolor.com/jQuery/demo/demo01b.html
dimensionhttp://brandonaaron.net/docs/dimensions/#code-samples
portlet 데모http://www.rymix.co.uk/jquery/d15/sortables2.html
FX데모http://magalies.net/downloads/Jquery/Interface%20examples/demos/ifx.html#pulsate-fx
오픈윈도우http://magalies.net/downloads/Jquery/Interface%20examples/demos/windows.html
JQuery tricks: using Greybox + form plugin for a modal dialog boxhttp://corky.net/dotan/programming/jquery.dialog/dialog-demo.html
 
FaceBoox style autosuggest with jQueryhttp://web2ajax.fr/examples/facebook_searchengine/
Auto-Growing Textarea Demohttp://www.aclevercookie.com/demos/autogrow_textarea.html
jQuery Helper for Komodo Media CSS Star Rater (Redux)http://www.m3nt0r.de/devel/raterDemo/
에디터http://avidansoft.com/dsrte/
 
jQuery Keyboard Navigation Pluginhttp://amountaintop.com/project/keynav/
텝http://jqueryfordesigners.com/demo/tabs.html
jQuery AccessKey Demohttp://methvin.com/jquery/jq-access.html
Semi-transparent rollover effect using jQueryhttp://coderseye.com/files/demos/pngrollover/index.html
Revealing Photo Sliderhttp://css-tricks.com/examples/RevealingPhotoSlider/
Simple jQuery form validationhttp://www.willjessup.com/sandbox/jquery/form_validator/form_validate.html
after callback demohttp://jsdesigning.com/gal/gal.php?top=10&id_pic=9&id_album=2
 
갤러리http://devkick.com/lab/galleria/demo_01.htm#img/ladybug.jpg
 
SWF Uploadhttp://www.alexandremagno.net/blog/wp-content/uploads/swfupload/index.htm
jQuery gradient - Visual Testhttp://brandonaaron.net/jquery/plugins/gradient/test/
tEditable :: In place table editing for jQueryhttp://joshhundley.com/teditable/index.html
 
 
 
 
sorthttp://interface.eyecon.ro/demos/sort.html
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
http://geeknation.blinklist.com/tag/jQuery/
 
http://www.nalanta.com/node/7http://www.noupe.com/jquery/50-amazing-jquery-examples-part1.htmlhttp://www.blinklist.com/mungkey/jquery/
 
 
http://geekswithblogs.net/AzamSharp/archive/2008/02/21/119882.aspx
http://www.learningjquery.com/2006/12/multiple-fancy-drop-caps
http://www.trirand.com/blog/?page_id=5
 
http://people.iola.dk/olau/flot/examples/selection.html(챠트 선택)
http://www.mootools.net/dragdrop/
http://plugins.jquery.com/project/Plugins/category/21
 
http://mohamedshaiful.googlepages.com/add_remove_form.htm
http://www.chazzuka.com/Portofolio/
http://dev.jquery.com/view/tags/ui/1.5b2/demos/ui.sortable.html
 
 
http://hooney.net/code/2007/08/UnobtrusiveTabNav/tabNav03.html
http://jqueryfordesigners.com/coda-slider-effect/
http://benjaminsterling.com/jquery-jqgalview-photo-gallery/
http://www.mind-projects.it/blog/jqzoom_v10
http://www.reach1to1.com/sandbox/jquery/jqchart/
http://jquery.lukelutman.com/plugins/flash/
http://leandrovieira.com/projects/jquery/lightbox/
http://marcgrabanski.com/code/ui-datepicker/
http://www.noupe.com/ajax/37-more-shocking-jquery-plugins.html
http://www.webdesignerwall.com/demo/jquery/
http://www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/imageslide-plugin.html
http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery
http://www.gcmingati.net/wordpress/wp-content/lab/jquery/imagestrip/imageslide-plugin.html
http://jquery.glyphix.com/
http://www.balupton.com/sandbox/jquery_lightbox/
챠트http://www.filamentgroup.com/lab/creating_accessible_charts_using_canvas_and_jquery/
http://sorgalla.com/projects/jcarousel/
http://designreviver.com/tutorials/jquery-examples-horizontal-accordion
http://host.sonspring.com/portlets/
http://www.webdesignerwall.com/tutorials/jquery-tutorials-for-designers/
http://www.digital-web.com/extras/jquery_crash_course/
 
http://www.blinklist.com/codearachnid/jquery/
http://drupalmodules.com/module/image-enhanced-scaling
http://www.ajaxdaddy.com/store
 
http://www.ajaxrain.com/tag.php?tag=image&page=2(모음)http://www.spicyexpress.net/general/jquerry-at-it-best-downloadable-jquerry-plugins-and-widgets-for-you-2/(예제모음)
http://mike.teczno.com/giant/pan/(pan)