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

Got something to add? You can just leave a comment.

  • 헛. 요런 맘에 드는 것도 있었군요. 유용하게 쓰일 곳이 많은 스크립트네요.
    유용한 정보 감사합니다.
    눈이 많이 오고 있네요. 눈길 조심하시고요. 즐거운 하루 보내세요.

    reply edit

  • 넵 고맙습니다.

    reply edit

  • 이노메이커 이노메이커

    이거 맘에 드네요..안그래도..이런걸 하나 만들어야 겠다고 생각했는데..벌써 나왔네요.
    참..빠릅니다.

    reply edit

  • 올라웍스 다닐적에는 이와 같은 타임라인에 데이터량까지 그래프로 뿌려주는 것을 만든적이 있는데요. 어렵다는 이유로 완전히 무산됐더랬죠; 그 소스가 어디로 도망갔는지 모르겠어요 ㅠ.ㅠ

    reply edit

Your Reaction Time!

captcha

avatar