Issue with Navbar icon in jquery mobile

断了今生、忘了曾经 提交于 2019-12-18 09:52:42

问题


I need to add the icon for my navbar, so I have downloaded the icon from the following link,http://www.glyphish.com/, I have downloaded the free icons. then I am trying to add the icons in the code, I cons are not displaying? What's wrong with code?

<div data-role="navbar">
                <ul>
                    <li><a id="other-color" data-icon="img/193-location-arrow.png" data-iconpos="left" href="#">Set Filter</a></li>
                    <li><a id="other-color" data-icon="img/193-location-arrow.png" data-iconpos="right" href="#">Add page</a></li>
                </ul> 

Screenshot:


回答1:


Create custom classes and modify their background-image using :after pseudo selector.

.ui-arrow:after {
  background-image: url(../193-location-arrow.png);
  background-size: 15px 15px;
}

.ui-location:after {
  background-image: url(../07-map-marker.png);
  background-size: 20px 20px;
}

Demo



来源:https://stackoverflow.com/questions/24578278/issue-with-navbar-icon-in-jquery-mobile

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!