jquery实现像栅栏一样左右滑出式二级菜单效果代码_jquery

//jquery.grooveshark.js
jQuery.fn.grooveshark = function() { 
 return this.each(function() {
 var raw = this;
 var elm = jQuery(this);
 var width = elm.width();
 var tel = 1;
 var smw = (width - 150) + 'px';
 jQuery('.ui-gs-panel', raw).css('left', width + 'px').hide();
 jQuery('.ui-gs-panel li', raw).css(width, smw);
 jQuery('.ui-gs-main li', raw).click(function() {
 var panel = jQuery(this).attr('rel');
 jQuery('.ui-gs-main li', raw).each(function() {
 var el = jQuery(this);
 if(el.hasClass('ui-active')) el.removeClass('ui-active');
 });
 jQuery(this).addClass('ui-active');
 jQuery('.ui-gs-main', raw).animate({ width: "150px" }, 1000);
 jQuery('.' + panel, raw).css('z-index', tel += 1).show().animate({ 'left': '150px' }, 1000, function() {
 jQuery('.ui-gs-panel', raw).each(function() {
 if(jQuery(this).hasClass(panel) == false) {
 jQuery(this).css('left', width + 'px');
 jQuery(this).css('z-index', '1');
 jQuery(this).hide();
 }
 });
 });
 });
 });
};
jQuery.fn.backhome = function() {
 return this.each(function() {
 var raw = this;
 var width = jQuery(raw).width();
 jQuery('.ui-active', raw).each(function() {
 jQuery(this).removeClass('.ui-active');
 });
 jQuery('.ui-gs-main', raw).animate({width: '100%'}, 1000).removeClass('ui-active');
 jQuery('.ui-gs-panel', raw).each(function() {
 jQuery(this).animate({'left': width + 'px'}, 1000, function() {
 $(this).hide();
 });
 });
 });
};