Rev. 2.73


ajaxorized.com은 타임라인위의 바 사이즈를 조정하고 이동하여 시작날짜와 끝날짜를 선택할 수 있는 슬라이딩 데이트피커를 만들고 공개했습니다. PrototypeScriptaculousDatejs라이브러리를 사용하고 있습니다. 다수의 과거 데이터 검색시 Ajax를 적용하여 실시간으로 생성되는 색다른 결과물 출력화면을 만들어 낼 수 있겠습니다. 사용방법 또한 매우 간단합니다. 멋지군요!

<header>
  <script type="text/javascript" src="js/prototype.js" ></script> 
  <script type="text/javascript" src="js/effects.js" ></script>
  <script type="text/javascript" src="js/builder.js" ></script>
  <script type="text/javascript" src="js/dragdrop" ></script>
  <script type="text/javascript" src="js/date-en-US.js" ></script> 
  <script type="text/javascript" src="js/dateslider.js" ></script>
  <link rel="stylesheet" href="css/dateslider.css" type="text/css" />
</header>
  
<div id="slider-container">
  <div id="sliderbar"></div>
</div>
  
<form> 
  <label for="datestart">Start:</label> <input type="text" id="datestart" /> 
  <label for="dateend">End:</label> <input type="text" id="dateend" /> 
</form>
DateSlider = new DateSlider('sliderbar', '2007-10-01', '2008-10-01', 2001, 2009);
DateSlider.attachFields($('datestart'), $('dateend'));

Comments