날짜 선택기 맞춤 설정

Question

헤더, 버튼 및 이미지의 위치를 ​​비롯하여 웹 사이트 테마에 맞게 jquery-ui datepicker를 완전히 맞춤 설정할 수 있습니까? 가능한 경우 무엇보다 접근해야합니다. 그것에 대해 어떻게 가야합니까? 나는 (거의) 그것을 완전히 재 설계하고 싶다. 가능한 다른 옵션은 무엇입니까?

jquery Theme Roller을 사용하여 비트를 변경/사용자 지정하려고했지만 버튼, 이미지 또는 날짜 선택 도구 상자의 전체 디자인을 변경할 수 없습니다.

도움이 매우 감사합니다.

Answer 1

수정할 수 있습니다. 이 링크를 통해 파일을 다운로드하십시오. 내가 선택한 datepicker 헤더, 콘텐츠, 선택한 스타일. n 개의 다른 옵션. JqueryUi-Datepickr

또는 대체 방법으로 JqueryDatepicker n 테마 탭을 선택할 수 있습니다.

이것은 날짜 시간 선택기의 일반적인 마크 업입니다. 당신은 그것을 사용자 정의 할 수 있습니다

<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all ui-helper-hidden-accessible"> 
    <div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all"> 
     <a class="ui-datepicker-prev ui-corner-all" title="Prev"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a> 
     <a class="ui-datepicker-next ui-corner-all" title="Next"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a> 
     <div class="ui-datepicker-title"> 
     <span class="ui-datepicker-month">January</span><span class="ui-datepicker-year">2009</span> 
     </div> 
    </div> 
    <table class="ui-datepicker-calendar"> 
     <thead> 
     <tr> 
     <th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th> 
     ... 
     </tr> 
     </thead> 
     <tbody><tr> 
     <td class="ui-datepicker-week-end ui-datepicker-other-month "> 1 </td> 
     ... 
     </tr> 
     </tbody> 
    </table> 
    <div class="ui-datepicker-buttonpane ui-widget-content"> 
     <button type="button" class="ui-datepicker-current ui-state-default ui-priority-secondary ui-corner-all">Today</button> 
     <button type="button" class="ui-datepicker-close ui-state-default ui-priority-primary ui-corner-all">Done</button> 
    </div> 
</div>