记录：初次尝试封装手风琴插件

$.fn.accordion = function (colors, width) {
    //传入有颜色的数组
    colors = colors || [];
    //传入宽度，不传为0；作为动画展开时，兄弟元素的宽度
    width = width || 0;
    //获取当前元素下的li元素
    var $li = this.find("li");
    //获取调当前元素的宽度；
    var boxLength = this.width();
    //获取鼠标进入时，当前元素展开的宽度
    var maxLength = boxLength - ($li.length - 1) * width;
    //获取鼠标离开时，所有li元素的宽度
    var avgLength = boxLength / $li.length;
    //更改li的颜色
    $li.each(function (i, e) {
      $(e).css("backgroundColor", colors[i]);
    });
    $li.on("mouseenter", function () {
      $(this).stop().animate({width: maxLength}).siblings().stop().animate({width: width});
    });
    $li.on("mouseleave", function () {
      $li.stop().animate({width: avgLength});
    })
  };

转载于:https://my.oschina.net/u/3848851/blog/1824812