<script>

function comma(obj) {
 
  data = obj.value;


  tmp = data.split('.');
  var str = new Array();
  var v = tmp[0].replace(/,/gi,'');
  var minus = false;
  
  if(v.charAt(0)=="-")
   minus = true;

  v = v.replace(/-/gi,'');
  
  for(var i=0; i<=v.length; i++) {
   str[str.length] = v.charAt(v.length-i);
   if(i%3==0 && i!=0 && i!=v.length) {
    str[str.length] = '.';
   }
  }
  str = str.reverse().join('').replace(/\./gi,',');

  if(minus==true)
   str = "-"+str;

  obj.value = (tmp.length==2) ? str + '.' + tmp[1] : str;
  

}

</script>

<input type="text" name="comma" onkeyup="comma(this)">

 

숫자에 콤마찍는 쏘쓰!

 

접속 방법.

 

실행 또는 cmd 창에서

 

mstsc /v:아이피 /admin

 

으로 접속하면 된다.

<table> 에서 style="border:solid 1px #000" 형태로 선을 넣었을경우.

 

공백상태의 행이나 열에서는 선이 표시가 안되는 경우가 있습니다.

 

이럴경우 각 <td> 에 &nbsp; 를 넣으면 해결이 되긴하지만..

 

양이 많을 경우 완전 노가다가 됩니다.ㅎㅎㅎ

 

이럴경우 border-collapse:collapse; 를 이용하면 공백에도 선이표시가 됩니다.

 

style="border:solid 1px #000;border-collapse:collapse;" 로 넣어주시면 됩니다.^^

따라 다니는 퀵메뉴 만들기


<!-- 퀵 메뉴 -->

<div style="float:right; top:50px; position:absolute; z-index:10; left:750px;" id="floater">

퀵메뉴에 들어갈 아이템 영역!!!

</div>


<!-- 퀵 메뉴 -->

<script language="javascript"type="text/javascript">

var lastScrollY = 0;

$(function(){

var diffY = document.documentElement.scrollTop;

// scroll event

$(window).scroll(function(){

var diffTop = Math.max(document.documentElement.scrollTop, document.body.scrollTop);

if (diffY != lastScrollY) {

percent = .10 * (diffY - lastScrollY);

if (percent > 0) {

percent = Math.ceil(percent);

} else {

percent = Math.floor(percent);

}

diffTop = parseInt($("#floater").offset().top) + percent;

lastScrollY = lastScrollY + percent;

}

$("#floater").stop();

$("#floater").animate({"top": diffTop}, 500);

});

});

</script>

인터넷에 넘 복잡시럽고 어려운게 많아서.. 여기저기 블로그에서 본 것들을 합치고 내가 직접 해본걸루 정리해두기

 

보통 통계검색시 시작일,종료일로 많이 달력스크립트 넣는데.. 자바스크립트로 웹에 돌아다니는건 넘 복잡해여 ㅋㅋ

제이쿼리로 클린하게! ㅋㅋ

친절하게 인풋박스 2개인 경우로  ^^

 

 

 

소스는 아래 더보기를 누르면 있구요.. 같은색깔끼리 잘 맞춰주심됩니당.

 

빨간색으로 표시한 부분은 input 박스 우측에 달력이미지버튼이 바로붙거나 위로붙어나오는경우가 있는데

해당 css로 조절해준거구요. 사이트 ui에따라 조절해주시면 됩니다.

그밑에 hide()는 이게 div영역이 하나 잡히는데 보기싫어서 감추어주었습니다. 요것도 각 사이트에 맞게 사용하심 될듯합니다.

 

도움이 되셧다면 공감, 덧글 꾸욱~^^

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

 

<script language="javascript" type="text/javascript">
$(document).ready(function() {

//******************************************************************************
// 상세검색 달력 스크립트
//******************************************************************************
var clareCalendar = {
monthNamesShort: ['1월','2월','3월','4월','5월','6월','7월','8월','9월','10월','11월','12월'],
dayNamesMin: ['일','월','화','수','목','금','토'],
weekHeader: 'Wk',
dateFormat: 'yymmdd', //형식(20120303)
autoSize: false, //오토리사이즈(body등 상위태그의 설정에 따른다)
changeMonth: true, //월변경가능
changeYear: true, //년변경가능
showMonthAfterYear: true, //년 뒤에 월 표시
buttonImageOnly: true, //이미지표시
buttonText: '달력선택', //버튼 텍스트 표시
buttonImage: 'res/img/comn/calendar.gif', //이미지주소
showOn: "both", //엘리먼트와 이미지 동시 사용(both,button)
yearRange: '1990:2020' //1990년부터 2020년까지
};
$("#fromDt").datepicker(clareCalendar);
$("#toDt").datepicker(clareCalendar);
$("img.ui-datepicker-trigger").attr("style","margin-left:5px; vertical-align:middle; cursor:pointer;"); //이미지버튼 style적용
$("#ui-datepicker-div").hide(); //자동으로 생성되는 div객체 숨김
});

</script>

 

 

<input name="fromDt" type="text" id="fromDt" size="8" maxlength="8" title="시작일자"> ~
<input name="toDt" type="text" id="toDt" size="8" maxlength="8" title="종료일자">

+ Recent posts