1

我正在创建一个 jQuery 移动应用程序。图标没有出现在我的任何页面中。

这是代码

<link rel="stylesheet" href="css/jquery.mobile.min.css" /> 
<script src="script/jquery-1.7.1.min.js"></script>
<script src="script/jquery.mobile.min.js"></script> 

但是当我使用 CDN 托管文件时,它工作正常。为什么会发生这种情况?

4

4 回答 4

8

如果您在本地使用它,则必须从 images 目录中再下载 4 个文件:icons-18-black.png、icons-36-black.png、icons-18-white.png 和 icons-36-white.png . 这些是 jquery css 用来显示这些图标的四个图像文件。下载它们并将其保存在“图像”文件夹中,并与您的 css 文件共享相同的根文件夹。它会很好地工作,因为 CDN 将为您托管这些图像。

下载链接

于 2013-08-30T05:20:44.303 回答
3

因为您使用的是内部包。内部包必须从您的电脑获取图标。您应该必须将整个文件包含在正确的目录中。或者尝试包括这个托管库

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
于 2013-08-30T04:58:42.250 回答
2

你没有在你的问题中提供足够的信息。您的错误可能有多种原因,例如:

  • 如果您使用的是图标字体:
    • 字体是否上传到正确的目录?
    • 该字体是否支持您调用的字符?
    • 您的图标是否font-size设置为可见值?
  • 如果您使用 jQuery 包含的图标:
    • 您是否已将它们上传到正确的目录?
    • 您是否将您的 URL 指向正确的位置来加载它们?
于 2013-08-30T04:58:49.063 回答
-1

我下载的 jQuery Mobile 版本也有同样的问题。

我从“ jquerymobile.jqGrid-Trial.zip ”文件中下载了代码。在我的笔记本电脑上,jqGrid Mobile 图标看起来不错,但在 iPhone 或 Android 设备上,它们会被严重抵消。

在此处输入图像描述

我的解决方案是将jquery.mobile.css文件的一部分修改为如下所示:

.ui-icon-plus, .ui-icon-minus, .ui-icon-delete, .ui-icon-arrow-r,
.ui-icon-arrow-l, .ui-icon-arrow-u, .ui-icon-arrow-d, .ui-icon-check,
.ui-icon-gear, .ui-icon-refresh, .ui-icon-forward, .ui-icon-back,
.ui-icon-grid, .ui-icon-star, .ui-icon-alert, .ui-icon-info, .ui-icon-home, .ui-icon-bars, .ui-icon-edit,
.ui-icon-search, .ui-icon-searchfield:after, 
.ui-icon-checkbox-off, .ui-icon-checkbox-on, .ui-icon-radio-off, .ui-icon-radio-on {
    background-image: url(images/icons-18-white.png);
    -moz-background-size: 776px 18px;
    -o-background-size: 776px 18px;
    -webkit-background-size: 776px 18px;
    background-size: 776px 18px;
}

(以前,它在其中有不同的背景图像名称,并且引用的图像宽度为 864 像素,而不是 776 像素。)

顺便说一句,为了找到这个解决方案,我实际上忽略了我从 jQuery 网站下载的 .zip 文件,查看了 jqGrid 自己的示例(它设备上运行良好),然后比较了“ jquery-mobile-1.2.0.他们选择使用的css文件:

工作 jQuery Grid 演示

希望这可以帮助。

于 2014-07-25T11:27:53.827 回答