Problem
How can I make this code snippet be improved to become more professional?
(function($){
$.fn.showMenu = function(options){
return this.each(function(){
$this = $(this);
var high = $this.outerHeight(),
scrollHeight = $this.get(0).scrollHeight;
$this.bind('mouseenter',function(){
$this.css({overflow:'visible'})
.stop()
.animate({height:scrollHeight},'fast');
}).bind('mouseleave',function(){
$this.animate({height:high}, function(){
$this.css({overflow:'hidden'});
});
});
});
}//the end of $.fn.showMenu
$('#theme_content').showMenu();
});
Solution
You could also use .hover, if you are going for shorter code.
Jquery Hover
-
Proper Indentation. You shouldn’t need the
//end of fn
comment. Just indent that entire block. -
$this = $(this)
needs avar
statement. -
You wrap your code in a function, which is good, but you need to call that function. The last line should be
})();