[jQuery] Plugin method
[jQuery] Plugin method
Hi all
I'm struggling to get a private function running in a plugin.
Here are the 2 pieces of code, first the running version then the more elegant but broken.
Obviously there is something that I have understood wrong in the pattern.
Can somebody point me to a better way to do this ?
//fully functionning
(function($){
$.fn.treeview = function(o){
var defaults = {
minus: 'url(style/site/interface/public/treeview/minus.gif) 0 0 no-repeat',
plus: 'url(style/site/interface/public/treeview/plus.gif) 0 0 no-repeat'
};
var opt = $.extend(defaults, o);
var $ul = $('li ul', this);
var $li = $('li', this);
$li.each(function(o, i){
$sub_ul = $('ul', this);
if ($sub_ul.length != 0) {
if ($sub_ul.css('display') != 'none') $(this).css({background: opt.minus});
else $(this).css({background: opt.plus});
}
});
return $li.toggle(
function(){$ul.hide('slow');},
function(){$ul.show('slow');}
);
}
})(jQuery);
// More elegant attempt but broken
(function($){
//settings
$.fn.treeview.defaults = {
minus: 'url(style/site/interface/public/treeview/minus.gif) 0 0 no-repeat',
plus: 'url(style/site/interface/public/treeview/plus.gif) 0 0 no-repeat'
};
//private (but I tried also with $.fn.treeview.setBg = function(o))
function setBg(li){
$sub_ul = $('ul', li);
if ($sub_ul.length != 0) {
if ($sub_ul.css('display') != 'none') $(li).css({background: opt.minus});
else $(li).css({background: opt.plus});
}
}
//constructor
$.fn.treeview = function(o){
var opt = $.extend(defaults, o);
var $ul = $('li ul', this);
var $li = $('li', this);
$li.each(function(o, i){
$(o).setBg();
});
return $li.toggle(
function(){$ul.hide('slow');},
function(){$ul.show('slow');}
);
}
})(jQuery);