</head>
<body>
-<div data-role="page" id="ButtonDemo" data-add-back-btn="true" >
+<div data-role="page" id="ButtonNolist" data-add-back-btn="true" >
<div data-role="header" data-position="fixed">
<h1>Buttons</h1>
</div>
*Default Button
<div data-role="button">Button</div>
HTML Code:
- <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset"><div data-role="button">Button</div></textarea>
+ <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset" class="formfield" readonly="readonly" disabled><div data-role="button">Button</div></textarea>
<br/><br/>
*Inline Button, Inline Button With Icon<br/>
<div data-role="button" data-inline="true">DataInline True</div>
<div data-role="button" data-inline="true" data-icon="favorite" data-style="nobg"></div>
<div data-role="button" data-inline="true" data-icon="rename" data-style="circle"></div><br/>
HTML Code:
- <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset"><div data-role="button" data-inline="true">DataInline True</div>
+ <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset" readonly="readonly" disabled><div data-role="button" data-inline="true">DataInline True</div>
<div data-role="button" data-inline="true" data-icon="call" data-iconpos="right">Icon Text</div>
<div data-role="button" data-inline="true" data-icon="call" data-iconpos="left">Icon Text</div>
<div data-role="button" data-inline="true" data-icon="favorite" data-style="nobg"></div>
*Default Button (A tag)
<a href="#buttonTest" data-role="button">A Tag Button</a>
HTML Code:
- <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset"><a href="#buttonTest" data-role="button">A Tag Button</a></textarea>
+ <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset" readonly="readonly" disabled><a href="#buttonTest" data-role="button">A Tag Button</a></textarea>
<br/><br/>
*Button Icon Position top, bottom (with inline)
<div data-role="button" data-icon="call" data-iconpos="top">PositionTop</div><br/>
<div data-role="button" data-icon="call" data-iconpos="top" data-inline="true">PositionTop</div>
<div data-role="button" data-icon="call" data-iconpos="bottom" data-inline="true">PositionBottom</div><br/>
HTML Code:
- <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset"><div data-role="button" data-icon="call" data-iconpos="top">PositionTop</div>
+ <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset" readonly="readonly" disabled><div data-role="button" data-icon="call" data-iconpos="top">PositionTop</div>
<div data-role="button" data-icon="call" data-iconpos="bottom">PositionBottom</div>
<div data-role="button" data-icon="call" data-iconpos="top" data-inline="true">PositionTop</div>
<div data-role="button" data-icon="call" data-iconpos="bottom" data-inline="true">PositionBottom</div></textarea><br/><br/>
<div data-role="button" data-inline="true" data-icon="call" style="width:150px;height:150px">Custom width,height</div>
<div data-role="button" data-inline="true" data-icon="call" data-style="circle"></div><br/>
HTML Code:
- <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset"><div data-role="button" data-inline="true" data-icon="call">Custom</div>
+ <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset" readonly="readonly" disabled><div data-role="button" data-inline="true" data-icon="call">Custom</div>
<div data-role="button" data-inline="true" data-icon="call" data-iconpos="top">Custom Top</div>
<div data-role="button" data-inline="true" data-icon="call" data-iconpos="bottom">Custom Bottom</div>
<div data-role="button" data-inline="true" data-icon="call" style="width:150px;height:150px">Custom width,height</div></textarea>
CSS Code:<br/>
- <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset">.ui-icon-test{
+ <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset" readonly="readonly" disabled>.ui-icon-test{
background-size: 100% 100%;
background-image: url(00_button_call);
}
*Input Type = "Button"
<input type="button" value="test button"/>
HTML Code:
- <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset"><input type="button" value="test button"/></textarea>
+ <textarea style="width:80%;padding:1em;background-color:whitesmoke;color:black;border-style:inset" readonly="readonly" disabled><input type="button" value="test button"/></textarea>
<br/><br/>
Button No text
<div data-role="button" id="button1test" data-corners="false" data-inline="false" data-style="circle"></div>
<div data-role="footer">
</div>
</div>
-
</body>
</html>