JSFiddle - React, Tailwind, and code Playground
by paska
HTML
<div id="text">Text text text</div>
JavaScript
// Use namespaces for all events the plugin manage.
(function ($, pluginName, undefined) {
window[pluginName + "DefaultSettings"] = window[pluginName + "DefaultSettings"] || {
autoShow: true,
copies: 1
};
var defaultSettings = window[pluginName + "DefaultSettings"];
$.fn[pluginName] = function (param) {
var settings,
methods = {
init: function () {
// Plugin Code:
for(var i = 0; i < settings.copies; i++)
this.parent().append(this.clone().attr("id", "").addClass(this.attr("id") + "-" + i).hide());
if(settings.autoShow)
show();
},
// Extra functions the plugin wants to expose.
show: function() {
for(var i = 0; i < settings.copies; i++)
this.parent().find("." + this.attr("id") + "-" + i).show();
},
destroy: function(i) {
if(i) {
this.parent().find("." + this.attr("id") + "-" + i).remove();
}
else {
for(i = 0; i < settings.copies; i++)
this.parent().find("." + this.attr("id") + "-" + i).remove();
}
clearSettings(this);
}
},
saveSettings = function (e) {
e.data(pluginName + "Settings", settings);
},
clearSettings = function(e) {
e.data(pluginName + "Settings", undefined);
},
pgArgs = arguments,
retorno;
this.each(function (i, element) {
var e = $(element);
settings = e.data(pluginName + "Settings");
if (methods[param]) {
methods[param].apply(e,...