22

我已经使用 jQuery ui datepicker 成功地将日历控件添加到我的文本框，但是上一个和下一个按钮不可见，尽管单击时包含的标签可以正常工作

当这些图像位于我的 web 包中的 ..\Content\theme\base\images 而不是下面显示的位置时，我如何修改它以显示http://jqueryui.com/datepicker/上显示的图标

.ui-widget-content .ui-icon {
background-image: url(images/ui-icons_222222_256x240.png);
}
.ui-widget-header .ui-icon {
background-image: url(images/ui-icons_222222_256x240.png);
}

我是否需要以与从我的 c# 代码中调用图像类似的方式在 css 中调用图像？如：

"@Url.Content("~/Content/theme/base/images/ui-icons_222222_256x240.png")"
4

6 回答 6

42

确保您jquery-ui.min.css指向图像的正确文件。当您尝试加载图标时，控制台应该会显示错误。

例如，如果这是您的 CSS 文件的位置：http://example.com/css/jquery-ui.min.css，则图标文件应位于http://example.com/css/images/ui-icons_222222_256x240.png. CSS 文件中的链接是相对于 CSS 文件的，而不是加载它的 HTML 文件。

于 2013-08-24T19:24:13.983 回答
3

你快到了。

只需确保更改您的网址并在行尾添加“！important”即可。

这将允许您添加任何您想要的图像。

    .ui-widget-content .ui-icon {
    background-image: url("../../images/ui-icons_222222_256x240.png")      
    !important;}
    .ui-widget-header .ui-icon {
    background-image: url("../../images/ui-icons_222222_256x240.png")   
    !important;}

希望这对你有用。

于 2016-10-09T08:15:55.853 回答
0

我从该网站正在查看的错误消息中注意到：

http://site/Content/images/image.png

我不太清楚为什么，正如 Mooseman 的回答：

CSS 文件中的链接是相对于 CSS 文件的，而不是加载它的 HTML 文件。

似乎该链接是相对的site.css（包含在 中Content）而不是Jquery-ui.mincss，因此它显然无法找到 png。

将路径更改JQuery-ui.min.css为

themes/base/images/image.png

它现在完美运行。

于 2017-03-27T09:11:29.240 回答
0

这是因为你是使命ui-icons_444444_256x240.png形象。您可以从此处链接下载该图像。

现在创建一个名为 - 的文件夹images并将该文件夹图像添加到该文件夹​​中。

例子

http://example.com/css/jquery-ui.min.css
http://example.com/css/images/ui-icons_444444_256x240.png
于 2019-03-19T08:32:32.230 回答
0

对于任何寻求最简单答案的人，

  1. 转到站点JQuery UI并使用默认设置下载文件。
  2. 提取文件。
  3. 复制“图像”文件夹并将其放入您的项目中 jQuery ui css 所在的同一文件夹中，这样可以解决问题。

感谢Gullele's Corner，自从文件夹结构更改（2019 年 5 月）以来，我只是简单地更新了程序。

于 2019-05-02T17:25:25.673 回答
0

我有同样的问题。我尝试更改 jquery-ui 文件中的相对 url，但图像仍然没有显示。相反，我不得不将指令放在我的 site.css 文件中。我的文件由 BundleConfig.cs 文件加载。

我将相对路径放在我的 site.css 文件中，图像开始工作。

.ui-icon,
.ui-widget-content .ui-icon {
    background-image: url("../../Scripts/lib/jquery-ui/images/ui-icons_444444_256x240.png");
}

于 2021-01-04T14:25:04.903 回答