dar*_*ten 6 javascript themeroller jquery-mobile
我正在使用jQueryMobile 1.1-rc1,我的页面加载指示器无法正确显示.
当themeroller第一次出现时,我最初制作了我的主题,直到最近的jQM的最后几次更新,一切都很好.
现在加载图标不会旋转,不再以气泡为中心.
更新时是否需要在themeroller中重新滚动主题?我没有看到在themeroller中选择目标版本的选项.
我又看了一遍,答案是 ThemeRoller for jQueryMobile 仅与 1.0.x 版本的 jQM 兼容。
Todd Parker在 jQueryMobile 问题跟踪器中回答了这个问题。
Tyler Benzinger在 Theme Roller 问题跟踪器中回答了这个问题。
看来我们得等待 Theme Roller 支持 1.1 版主题了。
更新:解决方案
在您的 theme.css 中注释掉或删除 .ui-icon-loading 部分并插入以下内容(来自 1.1-rc1 css)
/* loading screen */
.ui-loading .ui-loader { display: block; }
.ui-loader { display: none; z-index: 9999999; position: fixed; top: 50%; box-shadow: 0 1px 1px -1px #fff; left: 50%; border:0; }
.ui-loader-default { background: none; opacity: .18; width: 46px; height: 46px; margin-left: -23px; margin-top: -23px; }
.ui-loader-verbose { width: 200px; opacity: .88; height: auto; margin-left: -110px; margin-top: -43px; padding: 10px; }
.ui-loader-default h1 { font-size: 0; width: 0; height: 0; overflow: hidden; }
.ui-loader-verbose h1 { font-size: 16px; margin: 0; text-align: center; }
.ui-loader .ui-icon { background-color: #000; display: block; margin: 0; width: 44px; height: 44px; padding: 1px; -webkit-border-radius: 36px; -moz-border-radiu$
.ui-loader-verbose .ui-icon { margin: 0 auto 10px; opacity: .75; }
.ui-loader-textonly { padding: 15px; margin-left: -115px; }
.ui-loader-textonly .ui-icon { display: none; }
.ui-loader-fakefix { position: absolute; }
/* loading icon */
.ui-icon-loading {
background: url(images/ajax-loader.gif);
background-size: 46px 46px;
}
Run Code Online (Sandbox Code Playgroud)
确保主题图像文件夹中有新的 ajax-loader.gif 文件。