如何向Datepicker添加箭头？

Question

我已经构建了一个表单,并希望使用UI Datepicker来帮助人们选择日期.Datepicker工作正常,但不包含如何每月移动的[可见]线索.我知道点击上角会将日历移动到下个月或上个月,我想在角落框中添加一个视觉线索以帮助我的用户.如何将图像附加到显示器？

我无法提供日历的显示,因为我是新用户,但是左右指针所在的位置位于日期选择器日历的上角,其中点击已经根据需要更改了日历.

---

修订

在我看来,当CSS包含在脚本标记内的头部时,浏览器不会找到图像(存储在/ images /中).请参阅下面的文件结构 Chrome行为不同.目前,我不关心Chrome的问题.

自问这个问题后我做了什么:

我尝试使用jsfiddle但没有取得多大成功.http://jsfiddle.net/akakie/Pmpd8/

我在网上放了三个例子.查看源代码以查看代码.(对不起.我只限于2个链接.)

• http://communityband.org/t-date-included.php(包括CSS)
• http://communityband.org/t-date-link.php(CSV by <link>)
• http://communityband.org/t-date-import.php(CSS by @import())

不同之处在于如何检索CSS.

• datepicker的CSS包含在文档头中<style>code from jquery-ui.datepicker.css pasted here</style>.
• CSS重新审核 <link rel="stylesheet" href="/css/jquery-ui.datepicker.css" type="text/css" />

• 结果因浏览器而异:

  • 使用Firefox 4或Safari 5或IE 8:版本1可以正常工作,箭头和所有.datepicker的CSS包含在文档头中<style>code from jquery-ui.datepicker.css pasted here</style>.

  • 版本2和3找不到图像.其他格式是正确的.

  • 使用Chrome时,布局正确(日历显示为完整尺寸且有效)但不显示颜色和箭头.

文件结构

的WebRoot

• / CSS

  • /reset.css
  • /basefont.css
  • jquery.ui.datepicker.min.js

• /图片

  • /ui-[xxx].png(多个图像)

• / JS

  • /库
    • /jquery-1.6.1.min.js
    • /jquery.ui.datepicker.min.js

Answer 1

这看起来像是您缺少 CSS 文件或图像。

除了 jQuery(UI) JavaScript 文件之外，您还需要将 jQueryUI CSS 文件附加到脚本中。您可以从http://jqueryui.com网站下载整个包，包括 js、css、图像。

请注意，图像（默认情况下）需要位于与 CSS 文件位置相关的 images/ 文件夹中。如果要更改此结构，则需要更改 CSS 文件中的 background-image: 声明的图像路径。