一个日历控件的(My97 datepicker)主题
2014-12-12 00:00
639 查看
摘要: 感觉之前的太丑了,自己修改了一下
是在默认的主题基础上修改的,
如图。
白天不懂夜的黑
使用说明:
如果版本一样直接替换即可
版本是4.8的,
更多皮肤及使用说明:
详见:官网
是在默认的主题基础上修改的,
如图。
白天不懂夜的黑
使用说明:
如果版本一样直接替换即可
版本是4.8的,
/* * My97 DatePicker 4.8 */ .WdateDiv{ width:200px; background-color:#FFFFFF; border:1px solid #DCDCDC; box-shadow:1px 1px 5px #DCDCDC; padding:2px; border-radius:3px; color:#ffffff; } .WdateDiv2{ width:360px; } .WdateDiv *{font-size:9pt;} .WdateDiv .NavImg a{ display:block; cursor:pointer; height:16px; width:16px; } .WdateDiv .NavImgll a{ float:left; background:transparent url(img.gif) no-repeat scroll 0 0; } .WdateDiv .NavImgl a{ float:left; background:transparent url(img.gif) no-repeat scroll -16px 0; } .WdateDiv .NavImgr a{ float:right; background:transparent url(img.gif) no-repeat scroll -32px 0; } .WdateDiv .NavImgrr a{ float:right; background:transparent url(img.gif) no-repeat scroll -48px 0; } .WdateDiv #dpTitle{ height:24px; margin-bottom:2px; padding:1px; } .WdateDiv .yminput{ margin-top:2px; text-align:center; height:20px; border:0px; width:50px; cursor:pointer; } .WdateDiv .yminputfocus{ margin-top:2px; text-align:center; font-weight:bold; height:20px; color:#30373C; border:#DCDCDC 1px solid; width:50px; } .WdateDiv .menuSel{ z-index:1; position:absolute; background-color:#FFFFFF; border:#DCDCDC 1px solid; display:none; } .WdateDiv .menu{ cursor:pointer; background-color:#fff; } .WdateDiv .menuOn{ cursor:pointer; background-color:#DCDCDC; } .WdateDiv .invalidMenu{ color:#aaa; } .WdateDiv .YMenu{ margin-top:20px; } .WdateDiv .MMenu{ margin-top:20px; *width:62px; } .WdateDiv .hhMenu{ margin-top:-90px; margin-left:26px; } .WdateDiv .mmMenu{ margin-top:-46px; margin-left:26px; } .WdateDiv .ssMenu{ margin-top:-24px; margin-left:26px; } .WdateDiv .Wweek { text-align:center; background:#30373C; border-right:#30373C 1px solid; color:#FFFFFF; } .WdateDiv .MTitle{ background-color:#30373C; color:#FFFFFF; } .WdateDiv .WdayTable2{ border-collapse:collapse; border:#DCDCDC 1px solid; } .WdateDiv .WdayTable2 table{ border:0; } .WdateDiv .WdayTable{ line-height:20px; border:#DCDCDC 1px solid; } .WdateDiv .WdayTable td{ text-align:center; } .WdateDiv .Wday{ cursor:pointer; } .WdateDiv .WdayOn{ cursor:pointer; background-color:#DCDCDC; } .WdateDiv .Wwday{ cursor:pointer; color:orange; } .WdateDiv .WwdayOn{ cursor:pointer; color:#FFFFFF; background-color:#DCDCDC; } .WdateDiv .Wtoday{ cursor:pointer; color:#0066CC; } .WdateDiv .Wselday{ background-color:#30373C; color:#FFFFFF; } .WdateDiv .WspecialDay{ background-color:green; } .WdateDiv .WotherDay{ cursor:pointer; color:#0066CC; } .WdateDiv .WotherDayOn{ cursor:pointer; background-color:#30373C; color:#FFFFFF; } .WdateDiv .WinvalidDay{ color:#aaa; } .WdateDiv #dpTime{ float:left; margin-top:3px; margin-right:30px; } .WdateDiv #dpTime #dpTimeStr{ margin-left:1px; } .WdateDiv #dpTime input{ width:18px; height:20px; text-align:center; border:#DCDCDC 1px solid; } .WdateDiv #dpTime .tB{ border-right:0px; } .WdateDiv #dpTime .tE{ border-left:0; border-right:0; } .WdateDiv #dpTime .tm{ width:7px; border-left:0; border-right:0; } .WdateDiv #dpTime #dpTimeUp{ height:10px; width:13px; border:0px; background:url(img.gif) no-repeat -32px -16px; } .WdateDiv #dpTime #dpTimeDown{ height:10px; width:13px; border:0px; background:url(img.gif) no-repeat -48px -16px; } .WdateDiv #dpQS { float:left; margin-right:3px; margin-top:3px; background:url(img.gif) no-repeat 0px -16px; width:20px; height:20px; cursor:pointer; } .WdateDiv #dpControl { text-align:right; } .WdateDiv .dpButton{ height:20px; width:45px; border:#DCDCDC 1px solid; margin-top:2px; margin-right:1px; border-radius:3px; background-color:#30373C; color:#ffffff; cursor:pointer; }
更多皮肤及使用说明:
详见:官网
相关文章推荐
- 发现一个不错的 日期选择控件 My97 DatePicker
- My97 Datepicker 日历控件 $dp拒绝访问
- My97 DatePicker——强大的 JavaScript 日历控件
- My97 DatePicker一款好用的日历控件
- My97 DatePicker一款好用的日历控件
- 发现一个不错的 日期选择控件 My97 DatePicker
- 利用jquery ui的datepicker开发一个课程日历
- 分享一个很好用的 日期选择控件datepicker 使用方法分享
- 为jQuery UI 中的DatePicker 控件改造一个Clear按钮
- 做最好的日期控件,My97 DatePicker 4.8 Beta4
- 不依赖任何js框架的日期控件My97 DatePicker——支持小时、分钟、秒钟
- 好用的时间选择器控件:My97 DatePicker
- 功能强大界面漂亮的js日期控件 My97 DatePicker Ver 2.1
- 坚持打造最好的日期控件,My97 DatePicker 4.5 正式版发布(请留email,我直接email回复)
- 坚持打造最好的日期控件,My97 DatePicker 4.8 Beta3
- js 跨域的问题 (同一个主域名不同的二级域名下的跨域问题) 解决 WdatePicker.js my97日期选择控件
- 坚持打造最好的日期控件,My97 DatePicker 4.7 Release
- Jquery UI的日历控件datepicker限制日期
- 不依赖任何js框架的日期控件My97 DatePicker——支持小时、分钟、秒钟
- [控件]DatePicker日期,TimePicker时间,Calendar日历,DatePickerDialog弹出的日期,TimePickerDialog弹出的时间