JSFiddle - React, Tailwind, and code Playground
JavaScript
// jQuery Plugin Boilerplate
// A boilerplate for jumpstarting jQuery plugins development
// by François Germain
(function($) {
var
name = 'cssLive',
namespace = 'plugin-' + name,
Plugin = function( node, options ) {
// If no node passed to the plugin
if(!node.hasOwnProperty('nodeType')) {
options = node;
node = document;
// If node is part of a doc, take the doc
} else if(node.nodeType !== 9) {
node = node.ownerDocument;
}
var
instance = this,
element = $( node ),
interval = null,
settings = $.extend( {}, plugin.settings, options ),
/* PRIVATE METHODS */
init = function() {
if(settings.autoStart) {
instance.methods.start();
}
};
/* PUBLIC METHODS */
instance.methods = {
settings: function() {
return $.extend( {}, settings );
},
start: function() {
interval = setInterval(function() {
element.find('link[rel="stylesheet"]').each(function() {
var
link = $(this),
href = link.data(namespace + '-href');
if(!href) {
href = link.attr('href');
href += (href.match(/\?/) ? '&' : '?') + settings.uid + '=';
link.data(namespace + '-href', href);
}
link.attr('href', href + new Date().getTime());
});
}, settings.speed);
},
stop: function() {
clearInterval(interval);
interval = null;
}
}
// Save plugin instance and init
element.data( namespace, instance );
init();
};
plugin = $[ name ] = {
settings: {
autoStart: true,
uid: 'cssLiveUID',
speed: 1000
}
};
$.fn[ name ] = function( options ) {
var
args = arguments,
output;
this.each(function() {
// Get instance
if ( undefined == ( instance = $( this ).data( namespace ))) {
var instance = new Plugin( this, options );
}
if ( (...