jquery mobile navbar icons appear twice -


the icons in jquery mobile navbar appear twice, can't see why, code copied jquery docs

<link rel="stylesheet"       href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" /> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script> 

and navbar itself

<div data-role="navbar" class="ui-navbar" role="navigation">   <ul class="ui-grid-b">     <li class="ui-block-a">       <a id="showlatest" data-icon="grid" data-theme="a"          class="ui-btn-active ui-btn-icon-top ui-btn-up-a">         <span class="ui-btn-inner" aria-hidden="true">           <span class="ui-btn-text">latest</span>           <span class="ui-icon ui-icon-grid ui-icon-shadow"></span>         </span>       </a>     </li>     <li class="ui-block-b">       <a id="showstages" data-icon="star"          class="ui-btn ui-btn ui-btn-up-a ui-btn-icon-top" data-theme="a">         <span class="ui-btn-inner" aria-hidden="true">           <span class="ui-btn-text">top</span>           <span class="ui-icon ui-icon-star ui-icon-shadow"></span>         </span>       </a>     </li>     <li class="ui-block-c">       <a id="showclass" data-icon="gear" data-theme="a"          class="ui-btn ui-btn-up-a ui-btn-icon-top">         <span class="ui-btn-inner" aria-hidden="true">           <span class="ui-btn-text">other</span>           <span class="ui-icon ui-icon-gear ui-icon-shadow"></span>         </span>       </a>     </li>   </ul> </div> 

the output appears in picture: http://tinypic.com/r/1fcppz/5

suggestions why happening?

you don't have explicitly specify span tags. generated jquery plugin itself. try replacing code.

<div data-role="navbar" class="ui-navbar" role="navigation">   <ul class="ui-grid-b">     <li class="ui-block-a">       <a id="showlatest" data-icon="grid" data-theme="a"          class="ui-btn-active ui-btn-icon-top ui-btn-up-a">latest</a>     </li>     <li class="ui-block-b">       <a id="showstages" data-icon="star"          class="ui-btn ui-btn ui-btn-up-a ui-btn-icon-top" data-theme="a">top</a>     </li>     <li class="ui-block-c">       <a id="showclass" data-icon="gear" data-theme="a"          class="ui-btn ui-btn-up-a ui-btn-icon-top">other</a>     </li>   </ul> </div> 

Comments

Popular posts from this blog

linux - Does gcc have any options to add version info in ELF binary file? -

android - send complex objects as post php java -

charts - What graph/dashboard product is facebook using in Dashboard: PUE & WUE -