jquery mobile 1.4 alpha 2, icon with button -
i have icon on left , text on right, without using button markup rather using div or span.
i dont see how in doc, tried doing :
<a href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="left">left</a>
replacing tag div or span doesnt show icon
on end this:
<a href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="left">my text</a>
as this
<div href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="left">my text</div>
produce button icon. tried both firefox , chrome. see here: http://jsbin.com/evagisa/5/ (update link had stopped working , should ok now)
you need data-role="button"
markup. if read documentation here, says:
input-based buttons, links in toolbars , button elements auto-enhanced, no data-role required.
thus, div
, a
element require it.
update 2 - case of applying custom icons collapsible header
for collapsible header, jquery mobile provides data-collapsed-icon , data-expanded-icon attributes. use case as:
<div data-role="collapsible" data-collapsed-icon="arrow-r" data-expanded-icon="arrow-d" > <h3>header1</h3> <p>content 1</p> <p>content 2</p> </div>
Comments
Post a Comment