jQuery Mobile 图标无法显示
对jquery mobile来说,使用data-icon属性配置,可以设置元素的图标。图标没有变成右箭头,而是如下图所示:
//已经设置了图标 ,data-icon="home" data-iconpos="top"
<div class="ui-block-a"><a href="#" data-icon="home" data-iconpos="top" data-theme="a" data-role="button">首页</a></div>

而且是无论我怎么添加data-icon到任何元素上面,都是没有图标显示,最后发现,由于jquery mobile是使用CSS 3来渲染UI的,需要有一个图片集,
解决步骤:
1、下载。从下载的官方jquery mobile包里面,找到图片如下:
2、拷贝images文件夹到项目文件夹下。
目录结构如下:
icon图片需要与jquery mobile 的css文件在同一目录底下的images文件夹中,原因从jquery.mobile-1.3.1.min.css中可以看出:
在我的工程中,目录添加如下:

这样,jquery mobile就会自行去找到data-icon定义的图标,成功看到了图标:

原文:jquery mobile中图标不显示问题 - yangjun19890825的专栏 - 博客频道 - CSDN.NET http://blog.csdn.net/wlsyn/article/details/9969487
jQuery Mobile 图标无法显示的更多相关文章
- jQuery Mobile 图标
jQuery 图标 如需在 jQuery Mobile 中向按钮添加图标,请使用 data-icon 属性: <a href="#anylink" data-role=&qu ...
- jquery Mobile点击显示加载等待效果
点击某个按钮或链接时,触发等待加载效果: <script> <!-- $(document).bind("mobileinit", function(){ }); ...
- jQuery Mobile Data 属性
按钮 带有 data-role="button" 的超链接.button 元素.工具栏中的链接以及 input 字段都会自动渲染成按钮样式,不需要添加 data-role=&quo ...
- jQuery Mobile 入门基础教程
jQuery Mobile是jQuery在手机上和平板设备上的版本.jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架. jQue ...
- jquery mobile 自定义图标
Jquery Mobile框架包含了一组最常用的移动应用程序所需的图标,为了减少下载的大小,Jquery Mobile包含的是的白色的图标sprite图片,并自动在图标后添加一个半透明的黑圈以确保在任 ...
- jquery mobile 请求数据方法执行时显示加载中提示框
在jquery mobile开发中,经常需要调用ajax方法,异步获取数据,如果异步获取数据方法由于网速等等的原因,会有一个反应时间,如果能在点击按钮后数据处理期间,给一个正在加载的提示,客户体验会更 ...
- 【原创】小白学jquery Mobile《构建跨平台APP:jQuery Mobile移动应用实战》连载五(给按钮加图标)
在范例5-4所使用的导航栏中,已经为按钮加入了图标的样式,但是当时并没有介绍按钮的图标究竟是怎么一回事.下面截取范例5-4中导航栏部分的代码: <divdata-role="foote ...
- jQuery Mobile 手动显示ajax加载器,提示加载中...
在使用jQuery Mobile开发时,有时候我们需要在请求ajax期间,显示加载提示框(例如:一个旋转图片+一个提示:加载中...).这个时候,我们可以手动显示jQuery Mobile的加载器,大 ...
- jquery mobile将页面内容当成弹框进行显示
注:必须使用相对应版本的jquery mobile css.不然无法正常显示 <div data-role="page" id="pageone"> ...
随机推荐
- 能用存储过程的DBHelper类
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.D ...
- oracle sqlldr控制文件模板
Sqlldr userid=lgone/tiger control=a.ctl LOAD DATA INFILE 't.dat' // 要导入的文件 // INFILE 'tt.date' // 导入 ...
- mysql5.7.14安装与配置
参考文章链接: http://jingyan.baidu.com/article/afd8f4de9006d934e286e9fd.html http://www.cnblogs.com/wenthi ...
- 好用的自适应表格插件-bootstrap table (支持固定表头)
最近工作中找到了一款十分好用的表格插件,不但支持分页,样式,搜索,事件等等表格插件常有的功能外,最主要的就是他自带的冻结表头功能,让开发制作表格十分容易,不过网上大多都是英文文档,第一次使用会比较麻烦 ...
- ecshop 报错
ECShop出现Strict Standards: Only variables should be passed b (2014-06-04 17:00:37) 转载▼ 标签: ecshop 报错 ...
- python读取excel文件
一.xlrd的说明 xlrd是专门用来在python中读取excel文档的模块,使用前需要安装. 可以到这https://pypi.python.org/pypi/xlrd进行下载tar.gz文件,然 ...
- about Red_Hat_Enterprise_Linux_7
systemd systemd 是 Linux 的系统和服务管理程序,替换了 Red Hat Enterprise Linux 之前的发行本中使用的 SysV.systemd 与 SysV 和 Lin ...
- highcharts-Highmaps 动态传入城市名称
做前端按地区(地图)分布监控数据展示用了 HIGHMAPS JAVASCRIPT MAPS 控件,很好很强大. 基础实现是这样的:调用插件动态传入需要展示的数据(data),插件会在地图数据(mapd ...
- AndroidStudio 更新gradle Error:Failed to complete Gradle execution. Cause: Connection reset
Android Studio 报错:Error:Failed to complete Gradle execution. Cause: Connection reset.把最新可以运行的项目中g ...
- fixSidebar简介与修正log
fixSidebar是自己写的一个侧边栏固定小组件,主要是用于主内容较长时让侧边栏能保持显示,依赖于jQuery. Github地址 https://github.com/iRuxu/fixSideb ...