JSFiddle - React, Tailwind, and code Playground
by Marcus Ekwall
HTML
<a href="#" class="glglg">fkfkgkg</a>
<a href="#" class="view_title_images">fkfkgkg</a>
JavaScript
(function($, window, undefined){
var defaults = {
width : 800,
height : 600,
fitToView : true,
spaceFromEdge : 15,
overlay : {
show: true,
opacity: 0.4
},
tpl : {
overlay: '<div class="prodigal_overlay"/></div>',
wrapper: '\
<div class="prodigal_wrapper"> \
<div class="prodigal_outer"> \
<div class="prodigal_inner"> </div> \
</div> \
</div>',
},
_overlay : null,
_wrapper : null,
_outer : null,
_inner : null,
isActive : false,
isOpen : false
};
function Prodigal(elm, options) {
this.element = $(elm);
this.options = $.extend({}, defaults, options);
this.init();
}
$.extend(Prodigal.prototype, {
init : function (){
var self = this;
self.element.on("click", function() {
self.open();
});
},
/**
* This removes the overlay and wrapper from the screen on close of the modal
*/
close : function (){
},
open: function () {
console.log(this.element.data('prodigal').options);
//var settings = $.extend({}, $(this).data('prodigal'));
//$(settings.tpl.overlay).css({ 'opacity' : settings.overlay.opacity }).appendTo('body');
//$(settings.tpl.wrapper).css({ }).appendTo('body');
//console.log(settings);
},
// change existing options
options: function (options) {
$.extend(this.options, options);
}
});
// jQuery plugin wrapper
$.fn.prodigal = function () {
// create real array of arguments
var args = [].slice.call(arguments);
// loop through each...