jQuery:1.5.5.2,京东导航(当前默认设置)

简介:
ylbtech-jQuery:jQuery学习
jQuery:1.5.4.2.B,效果截图返回顶部

 nav_360buy

jQuery:1.5.5.2,京东导航(当前默认设置) HTML代码返回顶部
复制代码
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>夺宝岛 - 京东商城</title>
    <meta content="text/html; charset=gb2312" http-equiv="Content-Type">
    <style type="text/css">
        .w
        {
            margin: 0px auto;
            width: 990px;
            height: 50px;
        }
        #nav
        {
            background-image: url(http://misc.360buyimg.com/lib/skin/2012/i/20111221C.png);
            background-repeat: repeat-x;
        }
        #navitems
        {
            background-image: url(http://misc.360buyimg.com/lib/skin/2012/i/20111221C.png);
            background-repeat: repeat-x;
        }
        #navitems LI
        {
            background-image: url(http://misc.360buyimg.com/lib/skin/2012/i/20111221C.png);
            background-repeat: repeat-x;
        }
        #navitems .fore1
        {
            background-image: url(http://misc.360buyimg.com/lib/skin/2012/i/20111221C.png);
            background-repeat: repeat-x;
        }
        #navitems .curr A
        {
            background-image: url(http://misc.360buyimg.com/lib/skin/2012/i/20111221C.png);
            background-repeat: repeat-x;
        }
        #navitems .hover A
        {
            background-image: url(http://misc.360buyimg.com/lib/skin/2012/i/20111221C.png);
            background-repeat: repeat-x;
        }
        #nav
        {
            z-index: 6;
            position: relative;
            padding-left: 210px;
            margin-bottom: 10px;
            background: url(http://misc.360buyimg.com/lib/skin/2012/i/20111221C.png) #d00000 repeat-x 0px -315px;
            height: 52px;
            top: 0px;
            left: 0px;
        }
        #navitems
        {
            height: 40px;
        }
        #navitems LI
        {
            height: 40px;
        }
        #navitems LI A
        {
            height: 40px;
        }
        #navitems
        {
            background-repeat: no-repeat;
            background-position: 770px -273px;
        }
        #navitems LI
        {
            position: relative;
            width: 83px;
            background-repeat: no-repeat;
            background-position: -83px -509px;
            float: left;
        }
        #navitems LI A
        {
            position: absolute;
            text-align: center;
            width: 85px;
            font: bold 15px/40px "microsoft yahei";
            color: #fff;
            top: 0px;
            text-decoration: none;
            left: 0px;
        }
        #navitems .fore1
        {
            background-repeat: no-repeat;
            background-position: -55px -231px;
        }
        #navitems .curr
        {
            z-index: 1;
        }
        #navitems .hover
        {
            z-index: 1;
        }
        #navitems .curr A
        {
            background-position: 0px -161px;
        }
        #navitems .hover A
        {
            background-position: 0px -161px;
        }
    </style>
    <style type="text/css">
        .curr
        {
            background-color: Gray;
        }
    </style>
</head>
<body id="auction">
    <script type="text/javascript">
        window.pageConfig = {
            navId: "auction"
        };
    </script>
    <div id="o-header">
        
        <!--header end-->
        <div class="w">
            <div id="nav">
                <ul id="navitems">
                    <li id="nav-home" class="fore1"><a href="http://www.360buy.com/">首页</a></li>
                    <li id="nav-mall" class="fore2"><a href="http://fashion.360buy.com/">服装城</a></li>
                    <li id="nav-tuan" class="fore3"><a href="http://tuan.360buy.com/">团购</a></li>
                    <li id="nav-auction" class="fore4"><a href="http://auction.360buy.com/">夺宝岛</a></li>
                    <li id="nav-club" class="fore5"><a href="http://club.360buy.com/">京东社区</a></li></ul>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        (function () { if (pageConfig.navId) { var object = document.getElementById("nav-" + pageConfig.navId); if (object) object.className += " curr"; } })();
    </script>
    <!-- header end -->
</body>
</html>
复制代码
本文转自ylbtech博客园博客,原文链接: http://www.cnblogs.com/ylbtech/archive/2013/01/25/2877307.html ,如需转载请自行联系原作者
相关文章
|
15天前
|
JavaScript
jQuery制作的网站首页宽屏导航轮播图特效源码
jQuery制作的网站首页宽屏导航轮播图特效源码是一段基于jQuery制作的可用于商城首页 微商城 互联网公司或某些电子商城的首页特效,自带有二级菜单栏、轮播图滚动、登录注册按钮等等,非常全面,欢迎对此段代码感兴趣的朋友前来下载使用。
13 4
|
6月前
|
JavaScript 前端开发
jquery实现二级导航下拉菜单效果实例
jquery实现二级导航下拉菜单效果实例
103 0
|
JavaScript 前端开发
jquery导航选中按钮颜色变化
jquery导航选中按钮颜色变化
51 0
|
JavaScript
jquery品优购电梯导航4-74
jquery品优购电梯导航4-74
108 0
jquery品优购电梯导航4-74
|
JavaScript
jquery品优购电梯导航修复小bug并加上类名-73
jquery品优购电梯导航修复小bug并加上类名-73
97 0
jquery品优购电梯导航修复小bug并加上类名-73
|
JavaScript
jquery品优购电梯导航2-72
jquery品优购电梯导航2-72
166 0
jquery品优购电梯导航2-72
jquery-品优购电梯导航-71
jquery-品优购电梯导航-71
111 0
jquery-品优购电梯导航-71
|
JavaScript
jQuery实现京东轮播图
jQuery实现京东轮播图
156 0
jQuery实现京东轮播图
|
前端开发 JavaScript 索引