Home

Welcome to the material-modal wiki! ...

<title>Material Design Modal Demo</title>

<div class="content">  <!-- For Demo Only -->
  <a href="" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--colored modal__trigger" data-modal="#modal">
    Launch Modal
  </a>

  <div id="modal" class="modal modal__bg">
    <div class="modal__dialog">
      <div class="modal__content">
        <div class="modal__header">
          <div class="modal__title">
            <h2 class="modal__title-text">Modal</h2>
          </div>

          <span class="mdl-button mdl-button--icon mdl-js-button  material-icons  modal__close"></span>
        </div>


        <div class="modal__text">
          <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis laboriosam accusantium facere suscipit, alias accusamus corrupti consequatur at porro, voluptates commodi sed omnis voluptatem, ex officiis illum, architecto fugiat id?
          </p>
        </div>

        <div class="modal__footer">
          <a class="mdl-button mdl-button--colored mdl-js-button  modal__close">
            Close
          </a>
        </div>
      </div>
    </div>
  </div>
</div>


<script src="https://storage.googleapis.com/code.getmdl.io/1.0.5/material.min.js"></script> <!-- MDL JavaScript -->
<script src="path/to/js/material-modal.min.js"></script>