Html Use: jQuery faModal

Tuesday, 16 December 2014

jQuery faModal

Download Demo
This jquery plugin jQuery faModal is a modal Windows Plugin, that doesn’t suck with scrollbars. It’s small and easy to modify for your project.
1. INCLUDE CSS AND JS FILES

<link rel="stylesheet" href="jquery.faModal.css" />

<script src="jquery.js"></script>

<script src="jquery.faModal.js"></script>

2. HTML

<div class="fa-modal my-modal">

  <div class="fa-modal__close-btn"></div>

  <-- modal content goes here -->

</div>

Requires extra markup in your html to prevent 2 scrollbars if modal content is too big.

<body>
  <div class="fa-modal__page">
    <!-- your page content here -->
  </div>
</body>

3. JAVASCRIPT

$(document).ready(function () {

    $modal = $('.my-modal').faModal();

    $('.btn').click(function () {

      $modal.faModal('show');

    });

});

Ads

Tuesday, 16 December 2014

jQuery faModal

No comments:

Post a Comment