效果：
点击第二个菜单项后出现一个向上滑动的动画，控制margin-top底部另一个div中的文字
上移从而替换掉原有的文字。
原理其实不难无非就是css的控制加之jquery的代码
对docemnt中所有li绑定一个hover事件，事件中根据鼠标的状态（无非是移入与移除），
使用animate的动画方式使原有的div向上移70px，移出时再将页面效果变回原有的样子。
代码如下：
复制代码 代码如下:
$(function () {
var webnav = {
val: {
target: 0
},
init: function () {
$(.gnb ul li).on(hover, webnav.hover);
},
hover: function (e) {
if ($(this).index() == webnav.val.target) { return };
if (e.type == mouseenter) {
$(this).find(a>p).stop(true, true).animate({ margin-top: -70px }, 300);
} else if (e.type == mouseleave) {
$(this).find(a>p).stop(true, true).animate({ margin-top: 0px }, 300);
}
}
};
webnav.init();
});