jQuery鼠标悬浮菜单自动缩放效果

日期：2013-4-6  来源：GBin1.com

在线演示

如果大家经常访问gbin1博客的话，肯定熟悉首页的菜单自动缩放效果，当你鼠标悬浮当前菜单的时候，会挤压其它的菜单宽度。

使用以下代码也可以实现类似的菜单效果。

jQuery代码：

$("div.stripes > div").mouseenter(function() {
    $(this).stop(true, true).css("width","40%").siblings().css("width","20%");
  }).mouseleave(function(){
    $(this).stop(true, true).css("width","25%").siblings().css("width","25%");
  });

以下是调试效果：

在线调试：http://www.gbtags.com/gb/debug/4db63fea-828b-4545-834e-5f13f93b6951.htm

via 极客标签

来源：jQuery鼠标悬浮菜单自动缩放效果