日付設定
概要
日付で条件を絞り込む際に使用します。以下サンプルは jQuery の Datepicker を利用しています。用途によって適時変更してください。
※デザインを改変に関してはjQueryサイトを参考にしてください。
デザイン
以下はサンプルです。用途を定めてデザインしてください。
西暦 / INPUT
用途：案件ごとに設定してデザインしてください。
- 年
- 月
- 日
<div class="datepickerVal seireki">
<ul>
<li><input type="text" value="" class="year min">年</li>
<li><input type="text" value="" class="month min">月</li>
<li><input type="text" value="" class="date min">日</li>
</ul>
<input type="text" value="" class="datepicker" style="display:none;" />
</div>
西暦 / SPAN
用途：案件ごとに設定してデザインしてください。
- 年
- 月
- 日
<div class="datepickerVal seireki spanElm">
<ul>
<li><span class="year"></span>年</li>
<li><span class="month"></span>月</li>
<li><span class="date"></span>日</li>
</ul>
<input type="text" value="" class="datepicker" style="display:none;" />
</div>
和暦 / INPUT
用途：案件ごとに設定してデザインしてください。
- 年
- 月
- 日
<div class="datepickerVal">
<ul>
<li><input type="text" value="" class="year min">年</li>
<li><input type="text" value="" class="month min">月</li>
<li><input type="text" value="" class="date min">日</li>
</ul>
<input type="text" value="" class="datepicker" style="display:none;" />
</div>
和暦 / SPAN
用途：案件ごとに設定してデザインしてください。
- 年
- 月
- 日
<div class="datepickerVal spanElm">
<ul>
<li><span class="year"></span>年</li>
<li><span class="month"></span>月</li>
<li><span class="date"></span>日</li>
</ul>
<input type="text" value="" class="datepicker" style="display:none;" />
</div>
改変対象ファイル
- CSS:
- modules.scss 内に改変対象箇所があります。
- Javascript:
- tips.js / datePickers()関数