jquery ui 의 datepicker는 아주 강력하다.
창이 작을 경우엔 달력이 input위로 올라가는 배려까지!
하지만 모바일에서 사용할경우엔
달력의 위치가 고정이 되어야 한다면?!
jquery datepicker position fixed 막 이렇게 검색해봤는데 찾긴 찾았당.
뭐 잘됩니다.ㅎ
jQuery(".datepicker" ).datepicker({
dateFormat: "yymmdd", // 데이터 포멧 , 20120905 형식
showOn: "button", // 버튼클릭시
buttonImage: "/pc/images/common/btn_cal.gif", // 클릭될 버튼의 이미지
buttonImageOnly: true, // 인풋말고 버튼을 클릭해야 달력나옴.
nextText: '', //이전다음텍스트 없졍
prevText: '', //이전다음텍스트 없졍
dayNamesMin: ['일', '월', '화', '수', '목', '금', '토'], //데이터 형식 일~토로
monthNames: ['1월','2월','3월','4월','5월','6월', '7월','8월','9월','10월','11월','12월'], // 달도 한글로
monthNamesShort: ['1월','2월','3월','4월','5월','6월','7월','8월','9월','10월','11월','12월'], // 달도 한글로
beforeShow: function(input) {
var i_offset= $(input).offset(); //클릭된 input의 위치값 체크
setTimeout(function(){
$('#ui-datepicker-div').css({'top':i_offset.top, 'bottom':'', 'left':'10px'}); //datepicker의 div의 포지션을 강제로 input 위치에 그리고 좌측은 모바일이여서 작기때문에 무조건 10px에 놓았다.
})
}
});