mirror of
https://github.com/jlgarridol/Modalizer.js.git
synced 2026-03-06 02:12:06 +01:00
Compare commits
8 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
fa744e6f4f | ||
|
|
f9ef8a07d5 | ||
|
|
c66c625a71 | ||
|
|
908cf5ed8c | ||
|
|
e24e2ecdde | ||
|
|
8698ac9d32 | ||
|
|
8a956a0c20 | ||
|
|
5b179c4f85 |
18
README.md
18
README.md
@@ -10,12 +10,12 @@ Getting starting
|
||||
### Installation
|
||||
Via npm
|
||||
```bash
|
||||
$ npm install modalizer.js
|
||||
$ npm install @jlgarridol/modalizer.js@1.0.1
|
||||
```
|
||||
or add it directly using a CDN:
|
||||
```html
|
||||
<link rel="stylesheet" href="https://future/modalizer.min.css"/>
|
||||
<script src="https://future/modalizer.min.js"></script>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@jlgarridol/modalizer.js@1.0.2/dist/css/modalizer.min.css">
|
||||
<script src="https://cdn.jsdelivr.net/npm/@jlgarridol/modalizer.js@1.0.2/dist/js/modalizer.min.js"></script>
|
||||
```
|
||||
|
||||
### Basic usage
|
||||
@@ -26,9 +26,9 @@ Add class ```modalizer``` to the modal div.
|
||||
|
||||
**Example:**
|
||||
```html
|
||||
<a class="modalinit" data-modal="standart" href="#"> Click to open</a>
|
||||
<a class="modalinit" data-modal="standard" href="#"> Click to open</a>
|
||||
|
||||
<div class="modal modalizer fade" id="standart" tabindex= "-1" role="dialog">
|
||||
<div class="modal modalizer fade" id="standard" tabindex= "-1" role="dialog">
|
||||
...
|
||||
</div>
|
||||
```
|
||||
@@ -38,7 +38,7 @@ Add class ```closemodal``` to a ```<a>```, ```<buttom>``` or any else HTML eleme
|
||||
|
||||
**Example:**
|
||||
```html
|
||||
<div class="modal modalizer fade" id="standart" tabindex= "-1" role="dialog">
|
||||
<div class="modal modalizer fade" id="standard" tabindex= "-1" role="dialog">
|
||||
...
|
||||
<button class="closemodal">Close</button>
|
||||
...
|
||||
@@ -53,7 +53,7 @@ Add ```data-animate-in``` and ```data-animate-out``` with Animate.css animation
|
||||
|
||||
**Example:**
|
||||
```html
|
||||
<div class="modal modalizer animate__animated" id="standart" tabindex= "-1" role="dialog" data-animate-in="zoomIn" data-animate-out="zoomOut">
|
||||
<div class="modal modalizer animate__animated" id="standard" tabindex= "-1" role="dialog" data-animate-in="zoomIn" data-animate-out="zoomOut">
|
||||
...
|
||||
</div>
|
||||
```
|
||||
@@ -66,7 +66,7 @@ It is necessary create a instance of ```MOD_Stack``` with the same name in the *
|
||||
|
||||
**Example:**
|
||||
```html
|
||||
<div class="modal modalizer fade modal-optionable" data-stack="defaultStack" id="standart" tabindex= "-1" role="dialog">
|
||||
<div class="modal modalizer fade modal-optionable" data-stack="defaultStack" id="standard" tabindex= "-1" role="dialog">
|
||||
...
|
||||
</div>
|
||||
<script>
|
||||
@@ -88,7 +88,7 @@ In addition, to enable the animation between submodals it is necessary add class
|
||||
|
||||
**Example:**
|
||||
```html
|
||||
<div class="modal modalizer fade modal-optionable" data-stack="defaultStack" id="standart" tabindex= "-1" role="dialog">
|
||||
<div class="modal modalizer fade modal-optionable" data-stack="defaultStack" id="standard" tabindex= "-1" role="dialog">
|
||||
<div class="modal-dialog animate__animated" id="first_submodal" role="document">
|
||||
...
|
||||
<button class="beforeaction">Before</button>
|
||||
|
||||
4
dist/css/modalizer.css
vendored
4
dist/css/modalizer.css
vendored
@@ -1,6 +1,6 @@
|
||||
/*!
|
||||
* Modalizer.js v1.0.0 modalizerjs.jlgarridol.com
|
||||
* Copyright 2011-2020 José Luis Garrido-Labrador
|
||||
* Modalizer.js v1.0.1 modalizerjs.jlgarridol.com
|
||||
* Copyright 2020 José Luis Garrido-Labrador
|
||||
* Licensed under MIT (https://github.com/jlgarridol/modalizerjs/blob/main/LICENSE)
|
||||
*/
|
||||
body {
|
||||
|
||||
4
dist/css/modalizer.min.css
vendored
4
dist/css/modalizer.min.css
vendored
@@ -1,5 +1,5 @@
|
||||
/*!
|
||||
* Modalizer.js v1.0.0 modalizerjs.jlgarridol.com
|
||||
* Copyright 2011-2020 José Luis Garrido-Labrador
|
||||
* Modalizer.js v1.0.1 modalizerjs.jlgarridol.com
|
||||
* Copyright 2020 José Luis Garrido-Labrador
|
||||
* Licensed under MIT (https://github.com/jlgarridol/modalizerjs/blob/main/LICENSE)
|
||||
*/body{overflow-x:hidden;overflow-y:scroll!important}.modal{padding-right:0!important}.modal-backdrop.show{display:none}.MOD_supreme-container.modal-open{filter:blur(.5rem)}.modal-content{border:0!important}.modal-optionable{z-index:3000000000;background-color:rgba(0,0,0,.5);padding:0!important}.modal-optionable>.modal-dialog{--animate-duration:0.5s}.modal-optionable .modal-dialog{-webkit-transform:translate(0);-moz-transform:translate(0);transform:translate(0)}.modal-dialog.fullscreen{width:100%!important;height:100%!important;max-height:-moz-fit-content!important;min-height:-moz-fit-content!important;max-height:fit-content!important;min-height:fit-content!important;margin:0!important;padding:0!important;max-width:none!important;background-color:var(--white);opacity:1}.modal-content.fullscreen{height:auto!important;min-height:100%!important;border-radius:0!important}.modal-header.fullscreen{border-bottom:1px solid #9ea2a2!important}.modal-footer.fullscreen{border-top:1px solid #9ea2a2!important}@media (max-width:576px){.modal-dialog.fullscreen-sm{width:100%!important;height:100%!important;max-height:-moz-fit-content!important;min-height:-moz-fit-content!important;max-height:fit-content!important;min-height:fit-content!important;margin:0!important;padding:0!important;max-width:none!important}.modal-content.fullscreen-sm{height:auto!important;min-height:100%!important;max-height:100%!important;border-radius:0!important}.modal-header.fullscreen-sm{border-bottom:1px solid #9ea2a2!important}.modal-footer.fullscreen-sm{border-top:1px solid #9ea2a2!important}}
|
||||
8
dist/js/modalizer.js
vendored
8
dist/js/modalizer.js
vendored
@@ -1,6 +1,6 @@
|
||||
/*!
|
||||
* Modalizer.js v1.0.0 modalizerjs.jlgarridol.com
|
||||
* Copyright 2011-2020 José Luis Garrido-Labrador
|
||||
* Modalizer.js v1.0.1 modalizerjs.jlgarridol.com
|
||||
* Copyright 2020 José Luis Garrido-Labrador
|
||||
* Licensed under MIT (https://github.com/jlgarridol/modalizerjs/blob/main/LICENSE)
|
||||
*/
|
||||
|
||||
@@ -151,10 +151,6 @@ if (typeof $().modal != 'function') {
|
||||
MOD_animate = null;
|
||||
})
|
||||
});
|
||||
|
||||
$("#MOD_supreme-container").click(function(e){
|
||||
e.preventDefault();
|
||||
})
|
||||
|
||||
});
|
||||
|
||||
|
||||
6
dist/js/modalizer.min.js
vendored
6
dist/js/modalizer.min.js
vendored
@@ -1,6 +1,6 @@
|
||||
/*!
|
||||
* Modalizer.js v1.0.0 modalizerjs.jlgarridol.com
|
||||
* Copyright 2011-2020 José Luis Garrido-Labrador
|
||||
* Modalizer.js v1.0.1 modalizerjs.jlgarridol.com
|
||||
* Copyright 2020 José Luis Garrido-Labrador
|
||||
* Licensed under MIT (https://github.com/jlgarridol/modalizerjs/blob/main/LICENSE)
|
||||
*/
|
||||
let MOD_howManyModals=0,MOD_modalz=9999,MOD_animate="",MOD_oc=null,MOD_optionable=null,MOD_actioned=!1;function boostrapAnimation(modal,animation){var cls=modal.attr("class").split(" ");cls.pop(),cls.push("animate__"+animation),modal.attr("class",cls.join(" "))}function launchModal(modal){var animation=modal.data("animate-in")||null;null!=animation&&modal.addClass("animate__"+animation),modal.hasClass("show")?(modal.removeClass("show"),setTimeout((function(){modal.css("z-index",++MOD_modalz),modal.addClass("show")}),500)):(setCurrentModal(modal),modal.hasClass("modal-optionable")||MOD_howManyModals++,modal.modal("show")),modal.css("display","block"),setTimeout((function(){null!=animation&&modal.removeClass("animate__"+animation)}),1e3),$("#MOD_supreme-container").addClass("modal-open")}function resetmodals(){let curmodal;MOD_CURRENTMODAL.pop().modal("hide")}function afterresetmodal(curmodal){let stack=eval(curmodal.data("stack"));null!=stack&&stack.clean();let loop=0,anim=curmodal.data("animate-in")||null;curmodal.children("div").each((function(){let modal=$(this);boostrapAnimation(modal,"fadeInRight"),0==loop?(modal.css("display",""),null!=anim&&boostrapAnimation(modal,anim)):modal.css("display","none"),loop++}))}function setCurrentModal(modal){MOD_CURRENTMODAL.push(modal)}"function"!=typeof $().modal?console.error("Bootstrap modals not loaded"):$(document).ready((function(){$(".modalinit").each((function(){$(this).click((function(){let btn=$(this),modal=$("#"+btn.data("modal"));0!=modal.length&&launchModal(modal)}))})),$(".nextaction").each((function(){$(this).click((function(){let btn=$(this),stack=eval(MOD_CURRENTMODAL.peek().data("stack")),nexttext=btn.data("next")||"",dialog=btn.closest("div.modal-dialog");MOD_optionable={dialog:dialog,nexttext:nexttext,stack:stack,next:!0},MOD_actioned=!0,boostrapAnimation(dialog,"fadeOutLeftBig")}))})),$(".beforeaction").each((function(){$(this).click((function(){let btn=$(this),stack=eval(MOD_CURRENTMODAL.peek().data("stack")),before=stack.pop(),dialog=btn.closest("div.modal-dialog");MOD_optionable={before:before,dialog:dialog,next:!1},MOD_actioned=!0,boostrapAnimation(dialog,"fadeOutRightBig")}))})),$(".modal-dialog.animate__animated").each((function(){$(this).on("animationend",(function(e){if(null!=MOD_optionable&&MOD_actioned)if(MOD_actioned=!1,MOD_optionable.dialog.hide(),MOD_optionable.next)if(MOD_optionable.stack.push(MOD_optionable.dialog.attr("id")),""!=MOD_optionable.nexttext){let next=$("#"+MOD_optionable.nexttext);boostrapAnimation(next,"fadeInRightBig"),next.show()}else resetmodals();else if(null!=MOD_optionable.before){let before=$("#"+MOD_optionable.before);boostrapAnimation(before,"fadeInLeftBig"),before.show()}else MOD_optionable.dialog.show(),resetmodals()}))})),$(".modal.modalizer").each((function(){$(this).on("show.bs.modal",(function(){let it=$(this);it.hasClass("modal-optionable")||($("#MOD_supreme-container").addClass("modal-open"),it.css("z-index",++MOD_modalz))})),$(this).on("hide.bs.modal",(function(e){e.preventDefault();let it=$(this);var animation=it.data("animate-out")||null;null!=animation&&it.addClass("animate__"+animation),MOD_animate=animation,MOD_oc=it,it.removeClass("show"),MOD_modalz--,$('.modal[style*="display: block"]').length>1?$("#MOD_supreme-container").addClass("modal-open"):($("#MOD_supreme-container").removeClass("modal-open"),$("body").removeClass("modal-open"))}))})),$(".closemodal").each((function(){$(this).click((function(){let modal;$(this).closest("div.modal").modal("hide"),resetmodals()}))})),$(".modal.modalizer.animate__animated").each((function(){$(this).on("animationend",(function(e){let it=$(this);null!=MOD_animate&&it.removeClass("animate__"+MOD_animate),null!=MOD_oc&&(MOD_oc.css("display","none"),MOD_oc.hasClass("modal-optionable")&&afterresetmodal(MOD_oc)),MOD_oc=null,MOD_animate=null}))})),$("#MOD_supreme-container").click((function(e){e.preventDefault()}))}));class MOD_Stack{constructor(){this.items=[]}push(element){this.items.push(element)}pop(){return this.isEmpty()?null:this.items.pop()}peek(){return this.items[this.items.length-1]}isEmpty(){return 0==this.items.length}clean(){this.items=[]}}function removeItemOnce(arr,value){var index=arr.indexOf(value);return index>-1&&arr.splice(index,1),arr}const MOD_CURRENTMODAL=new MOD_Stack;
|
||||
let MOD_howManyModals=0,MOD_modalz=9999,MOD_animate="",MOD_oc=null,MOD_optionable=null,MOD_actioned=!1;function boostrapAnimation(modal,animation){var cls=modal.attr("class").split(" ");cls.pop(),cls.push("animate__"+animation),modal.attr("class",cls.join(" "))}function launchModal(modal){var animation=modal.data("animate-in")||null;null!=animation&&modal.addClass("animate__"+animation),modal.hasClass("show")?(modal.removeClass("show"),setTimeout((function(){modal.css("z-index",++MOD_modalz),modal.addClass("show")}),500)):(setCurrentModal(modal),modal.hasClass("modal-optionable")||MOD_howManyModals++,modal.modal("show")),modal.css("display","block"),setTimeout((function(){null!=animation&&modal.removeClass("animate__"+animation)}),1e3),$("#MOD_supreme-container").addClass("modal-open")}function resetmodals(){let curmodal;MOD_CURRENTMODAL.pop().modal("hide")}function afterresetmodal(curmodal){let stack=eval(curmodal.data("stack"));null!=stack&&stack.clean();let loop=0,anim=curmodal.data("animate-in")||null;curmodal.children("div").each((function(){let modal=$(this);boostrapAnimation(modal,"fadeInRight"),0==loop?(modal.css("display",""),null!=anim&&boostrapAnimation(modal,anim)):modal.css("display","none"),loop++}))}function setCurrentModal(modal){MOD_CURRENTMODAL.push(modal)}"function"!=typeof $().modal?console.error("Bootstrap modals not loaded"):$(document).ready((function(){$(".modalinit").each((function(){$(this).click((function(){let btn=$(this),modal=$("#"+btn.data("modal"));0!=modal.length&&launchModal(modal)}))})),$(".nextaction").each((function(){$(this).click((function(){let btn=$(this),stack=eval(MOD_CURRENTMODAL.peek().data("stack")),nexttext=btn.data("next")||"",dialog=btn.closest("div.modal-dialog");MOD_optionable={dialog:dialog,nexttext:nexttext,stack:stack,next:!0},MOD_actioned=!0,boostrapAnimation(dialog,"fadeOutLeftBig")}))})),$(".beforeaction").each((function(){$(this).click((function(){let btn=$(this),stack=eval(MOD_CURRENTMODAL.peek().data("stack")),before=stack.pop(),dialog=btn.closest("div.modal-dialog");MOD_optionable={before:before,dialog:dialog,next:!1},MOD_actioned=!0,boostrapAnimation(dialog,"fadeOutRightBig")}))})),$(".modal-dialog.animate__animated").each((function(){$(this).on("animationend",(function(e){if(null!=MOD_optionable&&MOD_actioned)if(MOD_actioned=!1,MOD_optionable.dialog.hide(),MOD_optionable.next)if(MOD_optionable.stack.push(MOD_optionable.dialog.attr("id")),""!=MOD_optionable.nexttext){let next=$("#"+MOD_optionable.nexttext);boostrapAnimation(next,"fadeInRightBig"),next.show()}else resetmodals();else if(null!=MOD_optionable.before){let before=$("#"+MOD_optionable.before);boostrapAnimation(before,"fadeInLeftBig"),before.show()}else MOD_optionable.dialog.show(),resetmodals()}))})),$(".modal.modalizer").each((function(){$(this).on("show.bs.modal",(function(){let it=$(this);it.hasClass("modal-optionable")||($("#MOD_supreme-container").addClass("modal-open"),it.css("z-index",++MOD_modalz))})),$(this).on("hide.bs.modal",(function(e){e.preventDefault();let it=$(this);var animation=it.data("animate-out")||null;null!=animation&&it.addClass("animate__"+animation),MOD_animate=animation,MOD_oc=it,it.removeClass("show"),MOD_modalz--,$('.modal[style*="display: block"]').length>1?$("#MOD_supreme-container").addClass("modal-open"):($("#MOD_supreme-container").removeClass("modal-open"),$("body").removeClass("modal-open"))}))})),$(".closemodal").each((function(){$(this).click((function(){let modal;$(this).closest("div.modal").modal("hide"),resetmodals()}))})),$(".modal.modalizer.animate__animated").each((function(){$(this).on("animationend",(function(e){let it=$(this);null!=MOD_animate&&it.removeClass("animate__"+MOD_animate),null!=MOD_oc&&(MOD_oc.css("display","none"),MOD_oc.hasClass("modal-optionable")&&afterresetmodal(MOD_oc)),MOD_oc=null,MOD_animate=null}))}))}));class MOD_Stack{constructor(){this.items=[]}push(element){this.items.push(element)}pop(){return this.isEmpty()?null:this.items.pop()}peek(){return this.items[this.items.length-1]}isEmpty(){return 0==this.items.length}clean(){this.items=[]}}function removeItemOnce(arr,value){var index=arr.indexOf(value);return index>-1&&arr.splice(index,1),arr}const MOD_CURRENTMODAL=new MOD_Stack;
|
||||
@@ -41,7 +41,7 @@
|
||||
<h5 class="col-7 text-center font-weight-normal">Lightweight extension over bootstrap's modals to improve of the control, animations and visualization of modal windows.</h5>
|
||||
<h6 class="col-12 text-right font-weight-bold">Licensed under MIT, created by José Luis Garrido-Labrador</h6>
|
||||
<hr class="col-4 offset-4"/>
|
||||
<h2 class="col-12 text-center">See it on <a href="https://github.com/jlgarridol/modalizerjs">GitHub</a></h2>
|
||||
<h2 class="col-12 text-center">See it on <a href="https://github.com/jlgarridol/modalizer.js">GitHub</a></h2>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="row">
|
||||
@@ -53,7 +53,7 @@
|
||||
<h3>Defaults modals</h3>
|
||||
<div class="container">
|
||||
<div class="mx-2 my-5">
|
||||
<button class="modalinit btn btn-lg btn-primary col-12 py-3 font-weight-bold" data-modal="standart" >Standart modal</button>
|
||||
<button class="modalinit btn btn-lg btn-primary col-12 py-3 font-weight-bold" data-modal="standard" >standard modal</button>
|
||||
</div>
|
||||
<div class="mx-2 my-5">
|
||||
<button class="modalinit btn btn-lg btn-warning col-12 py-3 font-weight-bold" data-modal="fullscreen">Fullscreen modal</button>
|
||||
@@ -100,7 +100,7 @@
|
||||
<div class="mx-4 my-2">
|
||||
<h4>Installation</h4>
|
||||
<p>Via npm</p>
|
||||
<pre><code class="shell">$ npm install modalizer.js</code></pre>
|
||||
<pre><code class="shell">$ npm install @jlgarridol/modalizer.js@1.0.1</code></pre>
|
||||
<p>or add it directly using a CDN:</p>
|
||||
<pre><code class="html"><link rel="stylesheet" href="https://future/modalizer.min.css"/>
|
||||
<script src="https://future/modalizer.min.js"></script></code></pre>
|
||||
@@ -109,15 +109,15 @@
|
||||
<p>Add class <code>modalinit</code> and modal's identifier in <code>data-modal</code> attribute to a <code><a></code>, <code><buttom></code> or any else HTML element.</p>
|
||||
<p>Add class <code>modalizer</code> to the modal <code>div</code></p>
|
||||
<p><strong>Example:</strong></p>
|
||||
<pre><code class="html"><a class="modalinit" data-modal="standart" href="#"> Click to open</a>
|
||||
<pre><code class="html"><a class="modalinit" data-modal="standard" href="#"> Click to open</a>
|
||||
|
||||
<div class="modal modalizer fade" id="standart" tabindex= "-1" role="dialog">
|
||||
<div class="modal modalizer fade" id="standard" tabindex= "-1" role="dialog">
|
||||
...
|
||||
</div></code></pre>
|
||||
<h5>Close a modal</h5>
|
||||
<p>Add class <code>closemodal</code> to a <code><a></code>, <code><buttom></code> or any else HTML element inside a modal <code>div</code></code>.</p>
|
||||
<p><strong>Example:</strong></p>
|
||||
<pre><code class="html"><div class="modal modalizer fade" id="standart" tabindex= "-1" role="dialog">
|
||||
<pre><code class="html"><div class="modal modalizer fade" id="standard" tabindex= "-1" role="dialog">
|
||||
...
|
||||
<button class="closemodal">Close</button>
|
||||
...
|
||||
@@ -126,13 +126,13 @@
|
||||
<p>Use a <strong>Animate.css</strong> animation for open and close animation</p>
|
||||
<p>Add <code>data-animate-in</code> and <code>data-animate-out</code> with <i>Animate.css</i> animation (without animate__), remove class <code>fade</code> and add class <code>animate__animated</code> in modal</p>
|
||||
<p><strong>Example:</strong></p>
|
||||
<pre><code class="html"><div class="modal modalizer animate__animated" id="standart" tabindex= "-1" role="dialog" data-animate-in="zoomIn" data-animate-out="zoomOut">
|
||||
<pre><code class="html"><div class="modal modalizer animate__animated" id="standard" tabindex= "-1" role="dialog" data-animate-in="zoomIn" data-animate-out="zoomOut">
|
||||
...
|
||||
</div></code></pre>
|
||||
<h4>Optionable modals</h4>
|
||||
<p>A optionable modal is which have multiple submodals inside and the user can navigate it between their.<br>To transform a modal into an optionable you need to add the <code>modal-optionable</code> class and assign a <code>data-stack</code> to it.<br>It is necessary create a instance of <code>MOD_Stack</code> with the same name in the <i>javascript</i></p>
|
||||
<p><strong>Example:</strong></p>
|
||||
<pre><code class="html"><div class="modal modalizer fade modal-optionable" data-stack="defaultStack" id="standart" tabindex= "-1" role="dialog">
|
||||
<pre><code class="html"><div class="modal modalizer fade modal-optionable" data-stack="defaultStack" id="standard" tabindex= "-1" role="dialog">
|
||||
...
|
||||
</div>
|
||||
<script>
|
||||
@@ -148,7 +148,7 @@
|
||||
<br>In the case of going backwards, the highest submodal in the stack will go. If the stack is empty then the modal will be closed.
|
||||
<br>In addition, to enable the animation between submodals it is necessary add class <code>animate__animated</code> in the submodal.</p>
|
||||
<p><strong>Example</strong></p>
|
||||
<pre><code class="html"><div class="modal modalizer fade modal-optionable" data-stack="defaultStack" id="standart" tabindex= "-1" role="dialog">
|
||||
<pre><code class="html"><div class="modal modalizer fade modal-optionable" data-stack="defaultStack" id="standard" tabindex= "-1" role="dialog">
|
||||
<div class="modal-dialog animate__animated" id="first_submodal" role="document">
|
||||
...
|
||||
<button class="beforeaction">Before</button>
|
||||
@@ -187,11 +187,11 @@
|
||||
</div>
|
||||
|
||||
<!--Modals-->
|
||||
<div class="modal modalizer animate__animated animate__fast" id="standart" tabindex="-1" role="dialog" data-animate-in="zoomIn" data-animate-out="zoomOut">
|
||||
<div class="modal modalizer animate__animated animate__fast" id="standard" tabindex="-1" role="dialog" data-animate-in="zoomIn" data-animate-out="zoomOut">
|
||||
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">Standart modal</h5>
|
||||
<h5 class="modal-title">standard modal</h5>
|
||||
<button type="button" class="close align-self-end closemodal">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
@@ -271,9 +271,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-dialog modal-dialog-centered modal-dialog-fullscreen modal-dialog-scrollable animate__animated animate__faster" id="lpage" style="display: none;" role="document">
|
||||
<div class="modal-dialog modal-dialog-centered fullscreen modal-dialog-scrollable animate__animated animate__faster" id="lpage" style="display: none;" role="document">
|
||||
<div class="modal-content fullscreen">
|
||||
<div class="modal-header modal-header-fullscreen">
|
||||
<div class="modal-header fullscreen">
|
||||
<h5 class="modal-title">Optionable modal</h5>
|
||||
<button type="button" class="close align-self-end closemodal">
|
||||
<span aria-hidden="true">×</span>
|
||||
@@ -282,7 +282,7 @@
|
||||
<div class="modal-body mx-0">
|
||||
<h1>Fullscreen block in optionable</h1>
|
||||
</div>
|
||||
<div class="modal-footer modal-footer-fullscreen">
|
||||
<div class="modal-footer fullscreen">
|
||||
<div class="container-fluid">
|
||||
<div class="row align-items-center">
|
||||
<h5 class="col-3">Page 2/2</h5>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@jlgarridol/modalizer.js",
|
||||
"version": "1.0.0",
|
||||
"version": "1.0.2",
|
||||
"description": "Lightweight extension over bootstrap's modals to improve of the control, animations and visualization of modal windows.",
|
||||
"main": "dist/js/modalizer.js",
|
||||
"style": "dist/css/modalizer.css",
|
||||
@@ -9,7 +9,7 @@
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/jlgarridol/modalizerjs.git"
|
||||
"url": "git+https://github.com/jlgarridol/modalizer.js.git"
|
||||
},
|
||||
"keywords": [
|
||||
"bootstrap",
|
||||
@@ -22,7 +22,7 @@
|
||||
"author": "Jose Luis Garrido-Labrador",
|
||||
"license": "MIT",
|
||||
"bugs": {
|
||||
"url": "https://github.com/jlgarridol/modalizerjs/issues"
|
||||
"url": "https://github.com/jlgarridol/modalizer.js/issues"
|
||||
},
|
||||
"homepage": "http://modalizerjs.jlgarridol.com",
|
||||
"dependencies": {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
/*!
|
||||
* Modalizer.js v1.0.0 modalizerjs.jlgarridol.com
|
||||
* Copyright 2011-2020 José Luis Garrido-Labrador
|
||||
* Modalizer.js v1.0.1 modalizerjs.jlgarridol.com
|
||||
* Copyright 2020 José Luis Garrido-Labrador
|
||||
* Licensed under MIT (https://github.com/jlgarridol/modalizerjs/blob/main/LICENSE)
|
||||
*/
|
||||
body {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
/*!
|
||||
* Modalizer.js v1.0.0 modalizerjs.jlgarridol.com
|
||||
* Copyright 2011-2020 José Luis Garrido-Labrador
|
||||
* Modalizer.js v1.0.1 modalizerjs.jlgarridol.com
|
||||
* Copyright 2020 José Luis Garrido-Labrador
|
||||
* Licensed under MIT (https://github.com/jlgarridol/modalizerjs/blob/main/LICENSE)
|
||||
*/
|
||||
|
||||
@@ -152,9 +152,9 @@ if (typeof $().modal != 'function') {
|
||||
})
|
||||
});
|
||||
|
||||
$("#MOD_supreme-container").click(function(e){
|
||||
/*$("#MOD_supreme-container").click(function(e){
|
||||
e.preventDefault();
|
||||
})
|
||||
});*/
|
||||
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user