Question

我在Phonegap的帮助下用html开发了一个Android应用程序。

创建了自己的应用主题

主题在IE和Chrome中显示出色，但不在我的手机中。我制作的Themeroller主题被标准主题取代。我不是唯一一个和其他许多人有同样的问题，see here。但是，通过阅读解决方案，我无法提供任何自己的解决方案。

我想要一些帮助来重写我的代码。

这是我的代码。

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">
<link rel="stylesheet" href="css/themes/Jakt.min.css" />
<link rel="stylesheet" href="css/themes/jquery.mobile.icons.min.css" />
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>

提前致谢。

Answer 1

以下是解决我问题的代码：

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="css/themes/jakt.css" />
  <link rel="stylesheet" href="css/themes/jquery.mobile.icons.min.css" />
  <link rel="stylesheet" href="jquery.mobile.structure-1.4.3.min.css" /> 
  <script src="jquery-1.11.1.js"></script> 
  <script src="jquery.mobile-1.4.3.min.js"></script>

我删除了<meta charset="utf-8" />，因为它无法正确显示斯堪的纳维亚字母。我也将文件设置为本地文件，尽管上面的代码可以正常使用URL。

Answer 2

当包含jQueryMobile Themeroller时，你必须包含一个带有基本css：http://code.jquery.com/mobile/1.4.3/jquery.mobile.structure-1.4.2.min.css的文件而不是标准文件。此文件是使用您的自定义css从网站下载的：

<!DOCTYPE html>
<html>
<head>

  <title>jQuery Mobile page</title>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="css/themes/my-custom-theme.css" />
  <link rel="stylesheet" href="css/themes/jquery.mobile.icons.min.css" />
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.3/jquery.mobile.structure-1.4.3.min.css" /> 
  <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> 
  <script src="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.js"></script> 

</head>

您的代码应为：

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile.structure-1.4.2.min.css" /> 
<link rel="stylesheet" href="css/themes/Jakt.min.css" />
<link rel="stylesheet" href="css/themes/jquery.mobile.icons.min.css" />
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>

Themeroller标题和Phonegap

2 个答案: