常识 共享 合作 bodog官网

    bodog官网专心于网页资料下载,供给博狗博彩、网页规划、ps资料、图片资料等,服务于【个人站长】【网页规划师】和【web开发从业者】的代码资料与规划资料网站。

    bodog官网供给网页资料下载、博狗博彩
    常识 共享 合作!

    左面跟从鼠标滑动导航仿淘宝UED

    作者:佳明妈 来历:jquery特效 2014-01-05 人气:
    仿淘宝UED的左面导航,这个导航有跟从鼠标滑动导航作用,鼠标脱离导航区域自动回到当时导航状况。 /*款式表文件来自 懒人css http://lrcss.lrjz100.com */ 下面是懒人css中的竖向导航菜单样
    仿淘宝UED的左面导航,这个导航有跟从鼠标滑动导航作用,鼠标脱离导航区域自动回到当时导航状况。

    /*款式表文件来自 懒人css http://lrcss.lrjz100.com */
    下面是懒人css中的竖向导航菜单款式
    /*---------竖向菜单(非必需)---------*/
    .bl-vernav li{ border-bottom:1px solid #ddd; margin-bottom:-1px;padding-top:1px;}
    .bl-vernav a{ display:block; height:20px; line-height:20px; padding:10px 16px;}
    .bl-vernav a:hover{ background:#F8F8F8;text-decoration:none;}
    /*.bl-vernav .cur a{ background:#428BCA; color:#fff;}*/
     
    .bl-vernav-ord{ border:1px solid #ddd;}
     
    .vernav-level li li{ border-left:none;border-right:none;}
    .vernav-level li li a{ padding-left:40px;}
    .vernav-level .cur .one{ background:#F8F8F8; }
    .vernav-level li .cur a{ background:#F8F8F8; }

    这个导航的鼠标滑动跟从导航作用js代码如下
    需求jquery支撑哦

    //bodog官网制作
    var verNav = $(".bl-vernav"),
    line = verNav.siblings(".auxline")
    verNavFisrt = verNav.children("li:first-child"),
    curY = verNav.children("li.cur").position().top;
     
    line.height(verNavFisrt.outerHeight()-1).width(verNavFisrt.outerWidth());//设置辅助线初始化高度和宽度,也能够直接用css设置好,这儿就不必js核算了 
     
    verNav.find("li").mouseenter(function(){
    var thisY = $(this).position().top;
    line.stop(true,true).animate({top:thisY},200);
    return false
    })
    .end()
    .mouseleave(function(){
    line.stop(true,true).animate({top:curY},300)
    }).trigger("mouseleave");
     
    完好的jquery导航代码作用请检查上面的代码框。

    jquery特效收拾发布
    ↓ 检查全文

    左面跟从鼠标滑动导航仿淘宝UED由bodog官网收集收拾,您能够自在传达,请自动带上本文链接

    bodog官网便是免费共享,觉得有用就多来支撑一下,没有能帮到您,懒人也只能表示遗憾,期望有一天能帮到您。

    左面跟从鼠标滑动导航仿淘宝UED-最新谈论

    • 副煌瞬74 2015-10-28 11:09:38
      [心]
    • 11 2015-10-28 11:10:38
      [心]
    • 斗胆秀火辣 2015-10-09 09:48:28
      顶.支撑,路过!
    • 11 2015-10-09 09:10:28
      顶.支撑,路过!