jQuery-UI ボタン
jQuery-uiボタン ノーマル
<button id="myButton1">Button</button>
<script type="text/javascript">
  $(function(){
    $('#myButton1').button();
  });
</script>
jQuery-uiボタン ç”»åƒä»˜ã(å·¦å´)
<button id="myButton2">
Button</button>
<script type="text/javascript">
  $(function(){
    $('#myButton2').button({
      icons: {
        primary: 'ui-icon-home'
      }
    });
  });
</script>
jQuery-uiボタン ç”»åƒä»˜ã(å³å´)
<button id="myButton3">Button</button>
<script type="text/javascript">
  $(function(){
    $('#myButton3').button({
      icons: {
        secondary: 'ui-icon-triangle-1-e'
      }
    });
  });
</script>
jQuery-uiボタン ç”»åƒä»˜ã(両å´)
<button id="myButton4">Button</button>
<script type="text/javascript">
  $(function(){
    $('#myButton4').button({
      icons: {
        primary: 'ui-icon-home',
        secondary: 'ui-icon-triangle-1-e'
      }
    });
  });
</script>
jQuery-uiボタン ç”»åƒã®ã¿
<button id="myButton5">Button</button>
<script type="text/javascript">
  $(function(){
    $('#myButton5').button({
      icons: {
        primary: 'ui-icon-home'
      },
      text: false
    });
  });
</script>
jQuery-uiボタン ツールãƒãƒ¼é¢¨
<div style="padding: 10px;">
  <button id="home">Home</button>
  <button id="config">Config</button>
  <button id="delete">Delete</button>
  <button id="contact">Contact</button>
  <button id="help">Help</button>
</div>
<script type="text/javascript">
  $(function(){
    $('#home').button({icons: {primary: 'ui-icon-home'},text: false});
    $('#config').button({icons: {primary: 'ui-icon-wrench'},text: false});
    $('#delete').button({icons: {primary: 'ui-icon-trash'},text: false});
    $('#contact').button({icons: {primary: 'ui-icon-mail-closed'},text: false});
    $('#help').button({icons: {primary: 'ui-icon-search'},text: false});
  });
</script>
指定ã™ã‚‹ç”»åƒåç§°ã¯jQuery-uiã®ãƒ†ãƒ¼ãƒžãƒšãƒ¼ã‚¸ã§èª¿ã¹ã‚‰ã‚Œã‚‹