PluginModal
Un plugin de modales
by Edgar Martinez
September 06, 2021
HTML
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css">
<div id='wModal'>
Esto es una modal
<table>
<tr>
<td>
COn una Tabla bieen chidaaaa y largaaaa
</td>
</tr>
</table>
</div>
<div id='wModal2'>
Este es otro modal bien chido
</div>
<button id='btnShow2'>
MOSTRAR OTRO
</button>
<button id='btnShow'>
MOSTRAR
</button>
<button id='btnClose'>
Cerrar
</button>
JavaScript
;(function($){
$.each(["show", "toggle", "toggleClass", "addClass", "removeClass"], function(){
var _oldFn = $.fn[this];
$.fn[this] = function(){
var hidden = this.find(":hidden").add(this.filter(":hidden"));
var result = _oldFn.apply(this, arguments);
hidden.filter(":visible").each(function(){
$(this).triggerHandler("show"); //No bubbling
});
return result;
}
});
var consola=console.log;
var $dragging = null;
var style_btn=".edmodal_btn{"+
"display: inline-block;"+
"font-weight: 400;"+
"color: #fff;"+
"text-align: center;"+
"vertical-align: middle;"+
"-webkit-user-select: none;"+
"-moz-user-select: none;"+
"-ms-user-select: none;"+
"user-select: none;"+
"background-color: transparent;"+
"border: 1px solid transparent;"+
"padding: 0.375rem 0.75rem;"+
"font-size: 0.9375rem;"+
"line-height: 1.5;"+
"border-radius: 0.25rem;"+
"-webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;"+
"transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;"+
"transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;"+
"transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;"+
"}"+
".edmodal_btn:hover {"+
"color: #fff;"+
"text-decoration: none;"+
"}"+
".edmodal_btn:focus, .btn.focus {"+
"outline: 0;"+
"-webkit-box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.25);"+
"box-shadow: 0 0 0 0.2rem rgba(55, 90, 127, 0.25);"+
"}"+
".edmodal_btn.disabled, .edmodal_btn:disabled {"+
"opacity: 0.65;"+
"}";
var style_danger=".edmodal_btn-danger {"+
" color: #fff;"+
" ...