JSFiddle - React, Tailwind, and code Playground

by Steven Senkus

HTML

<img class="target" src="http://www.placekitten.com/150/150" />
<button>click for lightbox</button>

JavaScript

/////////////////////////////////
//  Duralabel lightbox         //
//  Coded with some nice       //
//   functions in mind         //
/////////////////////////////////

/* ----------------------------------------------------------------
	How To:
		The selector is the "click" or trigger.
		image:
			$('image class').DLlight();
		Ajax:
			$('.lightme').DLlight({
				'type':'ajax',
				'width':'650',
				'page':'instructions.php .product-page div'
			});
		inline:
			$('.lightme').DLlight({
				'type':'inline',
				'width':'650', <-- if you need to change but can be left blank
				'elm':'.product-page' <-- div or class to change.
			});
		Class:
			I feel this one is new, I will add a class to an element on the page to move or change
			if you need to hide the element do so with javascript or css.
			$('.reqinfo').DLlight({
				'type':'class',
				'width':'650px',
				'elm':'#requestinfo', <-- element that you will be adding the class to.
				'class_name':'this_hello' <-- class name to be added to the element
			});
		YouTube:
			$('a.linkclass').DLlight({
				'type':'youtube'
			});
		iframe:
			$('a.linkclass').DLlight({
				'type':'iframe',
				'page':'http://www.duralabel.com',
				'width':'650px',
				'height':'700px'
			});
-------------------------------------------------------------------	*/

// light box function
(function( $ ) {
  $.fn.DLlight = function(options,callBack) {
  // Functions for lightbox
   var settings = $.extend({
      'type' : 'img', // img, inline, class, ajax
      'page' : '',
			'elm': '',
			'width': '',
			'height': '',
			'scroll': 'yes',
			'cssPosition':'fixed',
			'endframe':'',
			'class_name':''
    }, options);
	// other settings.
	var cssPosition = 'fixed';
	// add the html to the DOM
	function isset(pram){
		if(typeof pram != 'undefined'){
			return true;
		}else{
			return false;
		}
	}
    // close light box function
function lightbox_close(){
	$('#dlclose,...