Bootstrap Buttons Plugin Methods

Browse more Bootstrap Examples
<!DOCTYPE html>
<html>
   <head>
      <title>Try v1.2 Bootstrap Online</title>
      <link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet">
      <script src="bootstrap/scripts/jquery.min.js"></script>
      <script src="/bootstrap/js/bootstrap.min.js"></script>
   </head>
   <body>
   <h2>Click on each of the buttons to see the effects of methods</h2>
   <h4>Example to demonstrate  .button('toggle') method</h4>
   <div id="myButtons1" class="bs-example">
      <button type="button" class="btn btn-primary">Primary</button>
   </div>
   <h4>Example to demonstrate  .button('loading') method</h4>
   <div id="myButtons2" class="bs-example">
      <button type="button" class="btn btn-primary" 
         data-loading-text="Loading...">Primary
      </button>
   </div>
   <h4>Example to demonstrate  .button('reset') method</h4>
   <div id="myButtons3" class="bs-example">
      <button type="button" class="btn btn-primary" 
         data-loading-text="Loading...">Primary
      </button>
   </div>
   <h4>Example to demonstrate  .button(string) method</h4>
   <button type="button" class="btn btn-primary" id="myButton4" 
      data-complete-text="Loading finished">Click Me
   </button>
      <script type="text/javascript">
         $(function () {
            $("#myButtons1 .btn").click(function(){
               $(this).button('toggle');
            });
         });
         $(function() { 
            $("#myButtons2 .btn").click(function(){
               $(this).button('loading').delay(1000).queue(function() {
               });        
            });
         });   
         $(function() { 
            $("#myButtons3 .btn").click(function(){
               $(this).button('loading').delay(1000).queue(function() {
                  $(this).button('reset');
               });        
            });
         });  
         $(function() { 
            $("#myButton4").click(function(){
               $(this).button('loading').delay(1000).queue(function() {
                  $(this).button('complete');
               });        
            });
         }); 
      </script> 
   </body>
</html>
Bootstrap Buttons Plugin Methods

Follow

Newsletter
