Author: | punitweb |
---|---|
Views Total: | 1,963 views |
Official Page: | Go to website |
Last Update: | October 20, 2016 |
License: | MIT |
Preview:

Description:
The BOP JS/CSS framework helps you create responsive, cross-browser, Material Design / iOS / modern style popup boxes on the web applications.
How to use it:
Insert the BOP’s JavaScript and CSS files into the webpage.
<link rel="stylesheet" href="bop.css"> <script src="bop-js.js""></script>
Insert content into the popup box and add a theme ID of your choice to the wrapping element.
<div id="material-light"> Content goes here <div class="exit" onclick="Exit()">EXIT</div> </div> <div id="material-dark"> Content goes here <div class="exit" onclick="Exit()">EXIT</div> </div> <div id="material-light-anime"> Content goes here <div class="exit" onclick="Exit()">EXIT</div> </div> <div id="material-dark-anime"> Content goes here <div class="exit" onclick="Exit()">EXIT</div> </div> <div id="ios-light"> Content goes here <div class="exit" onclick="Exit()">EXIT</div> </div> <div id="ios-dark"> Content goes here <div class="exit" onclick="Exit()">EXIT</div> </div> <div id="modern-light"> Content goes here <div class="exit" onclick="Exit()">EXIT</div> </div> <div id="modern-dark"> Content goes here <div class="exit" onclick="Exit()">EXIT</div> </div> <div id="modern-light-anime"> Content goes here <div class="exit" onclick="Exit()">EXIT</div> </div>
Create trigger buttons to toggle the popup boxes.
<div class="button" onclick="materialLight()"> Open The Popup </div>
More triggers.
materialLight() materialDark() materialLightAnime() iosLight() iosDark() modernLight() modernDark() modernLightAnime() modernDarkAnime()
More Previews:

iOS style

Modern Style
that library pop very clearly understanding for me https://goo.gl/aA7xJ8