$(function () {

A:当点击[移动端]/鼠标移入上部菜单选项卡时，设置内容列表区域

 1.监听选项卡的移入事件

$(".navc>li").mouseenter(function () {
 1.1修改被移入选项卡
$(this).addClass("current");
 1.2还原其它兄弟选项卡
$(this).siblings().removeClass("current");
 1.3获取当前移出选项卡的索引
var index = $(this).index();
 1.4根据索引找到对应的
var $li = $(".contentc>li").eq(index);
console.log(index);
 1.5 this下的操作
$li.addClass("contli_style").animate({"top": "-3px" , }, 300);
1.6 this下的操作siblings
$li.siblings().removeClass("contli_style").animate({"top": "0px" , }, 300);
});

B:当点击[移动端]/鼠标移入内容区域时，设置上部菜单选项卡
$(".contentc>li").mouseenter(function () {
$(this).addClass("contli_style").animate({"top": "-3px" , }, 300);
$(this).siblings().removeClass("contli_style").animate({"top": "0px" , }, 300);
var index = $(this).index();
var $navc_li = $(".navc>li").eq(index);
$navc_li.addClass("current");
$navc_li.siblings().removeClass("current");
});

});

【完整代码下载】

上一篇：网页中只渲染日期不显示时间的解决方法

下一篇：百度编辑器上传图片后出现图片属性焦点无法编辑下文的解决方法