STEP 7 - コードをプラグイン化しよう
プラグイン化すると同時に、オプションでスピードを変更できるようにしています。
jQuery Code
$.fn.dropdownMenu = function(options){
options = $.extend({
speed: "fast"
}, options);
$("li", this).each(function(){
var subMenu = $(">ul", this);
var defaultHeight = subMenu.height();
$(this).hover(function(){
if( subMenu.css("display") == "none" ){
subMenu.slideDown(options.speed, function(){
subMenu.css("overflow", "visible");
});
} else {
subMenu.stop().animate({
"height": defaultHeight
}, options.speed, function(){
subMenu.css("overflow", "visible");
});
}
},
function(){
subMenu.stop().slideUp(options.speed);
});
});
$("li:has(ul) > a", this).append('<span class="icon"></span>');
$("ul", this).prepend('<li class="balloon-caret"></li>').hide();
return this;
}
$(function(){
$("#dropdown").dropdownMenu({
speed: 200
});
});