腾讯游戏《上古世纪》官网导航代码

《上古世纪》是“韩国网游第一人”——宋在京开发的一款网游，由腾讯公司代理。《上古世纪》官方网站的导航非常漂亮，尤其是大幅的半透明背景非常有特点。

演 示 下 载

使用方法

1、引入文件

<link rel="stylesheet" href="css/archenav.css">

<script src="js/jquery-1.9.0.min.js"></script>

<script src="js/archenav.js"></script>

2、HTML

<div class="header">

    <div class="topNav" id="topNav">

        <div class="topNav2">

            <div class="navBox">

                <div class="navIndexBg">

                    <div class="navIL"></div>

                    <div class="navIL navIR"></div>

                    <div class="navIM"></div>

                </div>

                <div class="navMain" id="navMain">

                    <!-- 主导航放这里 -->

                    <div class="navIndex" id="navIndex">

                        <ul>

                            <li>

                                <a href="###" title="官网首页" class="nav4">官网首页</a>

                            </li>

                            <li>

                                <a href="###" title="游戏资料">游戏资料</a>

                            </li>

                            <li class="nav1">

                                <a href="###" title="视觉盛宴">视觉盛宴</a>

                            </li>

                            <li>

                                <a href="###" title="游戏下载">游戏下载</a>

                            </li>

                            <li>

                                <a href="###" title="新闻活动">新闻活动</a>

                            </li>

                            <li>

                                <a href="###" title="玩家社区">玩家社区</a>

                            </li>

                        </ul>

                    </div>

                    <div class="navSub" id="navSub">

                        <dl class="nav2">

                            <dt>游戏资料</dt>

                            <dd>

                                <a href="###" title="游戏介绍">游戏介绍</a>

                            </dd>

                            <dd>

                                <a href="###" title="游戏特色">游戏特色</a>

                            </dd>

                            <dd>

                                <a href="###" title="系统介绍">系统介绍</a>

                            </dd>

                            <dd>

                                <a href="###" title="新手指南">新手指南</a>

                            </dd>

                        </dl>

                        <dl class="nav1">

                            <dt>视觉盛宴</dt>

                            <dd>

                                <a href="###" title="游戏视频">游戏视频</a>

                            </dd>

                            <dd>

                                <a href="###" title="游戏壁纸">游戏壁纸</a>

                            </dd>

                            <dd>

                                <a href="###" title="游戏截图">游戏截图</a>

                            </dd>

                            <dd>

                                <a href="###" title="游戏音乐">游戏音乐</a>

                            </dd>

                        </dl>

                        <dl>

                            <dt>游戏下载</dt>

                            <dd>

                                <a href="###" title="游戏下载">游戏下载</a>

                            </dd>

                            <dd>

                                <a href="###" title="其他下载">其他下载</a>

                            </dd>

                        </dl>

                        <dl>

                            <dt>新闻活动</dt>

                            <dd>

                                <a href="###" title="新闻中心">新闻中心</a>

                            </dd>

                            <dd>

                                <a href="###" title="活动专题">活动专题</a>

                            </dd>

                        </dl>

                        <dl>

                            <dt>玩家社区</dt>

                            <dd>

                                <a href="###" title="积分中心">积分中心</a>

                            </dd>

                            <dd>

                                <a href="###" title="官方互动">官方互动</a>

                            </dd>

                            <dd>

                                <a href="###" title="官方论坛">官方论坛</a>

                            </dd>

                        </dl>

                    </div>

                    <!-- 二级放这里 end -->

                </div>

            </div>

        </div>

    </div>

    <div class="logoBox">

        <h1 id="logo" class="logoPNG">

            上古世纪官方网站

        </h1>

    </div>

</div>

演 示 下 载

下载地址

·进入下载地址列表