How to use Bootstrap Collapse Plugins

The collapse plugin makes it easy to make collapsing divisions of the page. Whether you use it to build an accordion navigation or content boxes, it allows for a lot of content options.

You can try to run the following code to implement collapse plugins in Bootstrap −

Example

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap Example</title>
      <link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet">
      <script src = "/scripts/jquery.min.js"></script>
      <script src = "/bootstrap/js/bootstrap.min.js"></script>
   </head>
   <body>
      <div class = "panel-group" id = "accordion">
         <div class = "panel panel-default">
            <div class = "panel-heading">
               <h4 class = "panel-title">
                  <a data-toggle = "collapse" data-parent = "#accordion" href = "#collapseOne">
                     Click me to expand. Click me again to collapse.Section
                  </a>
               </h4>
            </div>
            <div id = "collapseOne" class = "panel-collapse collapse in">
               <div class = "panel-body">
                  Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
                  nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo.
               </div>
            </div>
         </div>
      </div>
   </body>
</html>

Smita Kapse

Published on 22-Jun-2018 09:02:53

Previous Page Print Page Next Page