// JQUERY CODE WIDGETS
// =================================================
// ========== AVOID JQUERY CONFLICT =============
(function($){
$(".test").html("hello world");
})(jQuery);
// ========== JQUERY PLUGIN WITH OPTIONS ==================
$.fn.tooltip = function(options) {
var settings = $.extend({
'location': 'top',
'background-color': 'blue'
}, options);
return this.each(function() {
// main Code
});
};
$('div').tooltip({
'location': 'left'
});
// ========== PLUGIN WITH PROTOTYPE ==========
function PluginName(jqueryObject, options) {
}
PluginName.prototype = {
publicMethod: function() {},
_privateMethod: function() {}
}
// Initializing
var myPluginInstance = new PluginName($(".mySelector"), {
myOption: 1
});
myPluginInstance.publicMethod();
// ========== JQUERY PLUGIN OPTIONS ==========
(function($) {
$.fn.plugin = function(options) {
options = $.extend({
test: 'Test'
}, options);
$.fn.plugin.method = function(text) {
return '<strong>' + text + '</strong>';
};
$.fn.plugin.settings = options;
return this.each(function() {
var $element = $(this);
$element.html($.fn.plugin.method(options.test));
});
};
})(jQuery);
$('#test').plugin();
alert($('#test').plugin.method('Foo'));
alert($('#test').plugin.settings.test);