蓝色风格阿里云导航菜单代码

版权:原创 更新时间:1年以上
[该文章底部包含文件资源,可根据自己情况,决定是否下载资源使用,时间>金钱,如有需要,立即查看资源]

以下是 蓝色风格阿里云导航菜单代码 的示例演示效果:

当前平台(PC电脑)
  • 平台:

部分效果截图:

蓝色风格阿里云导航菜单代码

HTML代码(index.html):

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>蓝色风格阿里云导航菜单代码</title>
<link rel="stylesheet" href="css/global.css">
<link rel="stylesheet" href="css/common-header9.css">
<script type="text/javascript" src="./js/base-all.js"></script>
<script type="text/javascript" src="./js/common-header.js"></script>
</head>
<body>
<!-- 开发者中心数据拼接-->
<!-- 培训与频道拼接-->
<!-- 互联网+拼接-->
<div data-spm="2">
  <div class="ali-common-header">
    <div class="ali-common-header-inner common-header-clearfix">
      <!-- 运营专区 -->
      <div class="activity item pull-left">
        <div class="flash-wrap" id="J-ali-activity-img">
          <img src="images/TB1nHoRLXXXXXa3XVXXx1caHXXX-460-124.gif"
          style="height: 62px;width: 230px;">
        </div>
        <div class="link logo">
          <a href="#" data-spm-click="gostr=/aliyun;locaid=20160107">
          </a>
        </div>
        <div class="link activity-url" id="J-activity-url" activity-url="#/ntms/201601/hello.html?spm=5176.383338.3.1.3U4qp9">
        </div>
      </div>
      <!-- 导航菜单 -->
      <ul class="menu item pull-left" id="J_common_header_menu" data-spm="201">
        <li class="top-menu-item" has-dropdown="true" menu-type="product" data-spm-click="">
          <span class="menu-hd">
            产品
          </span>
          <div class="menu-dropdown common-header-clearfix">
            <div class="menu-dropdown-inner">
              <div class="menu-dropdown-sidebar pull-left">
                <a data-spm-click="gostr=/aliyun;locaid=" class="active common-header-clearfix"
                href="javascript:void(0);" sidebar-type="ecs">
                  弹性计算
                  <span class="icon pull-right">
                  </span>
                </a>
                <a data-spm-click="gostr=/aliyun;locaid=" class=" common-header-clearfix"
                href="javascript:void(0);" sidebar-type="database">
                  数据库
                  <span class="icon pull-right">
                  </span>
                </a>
                <a data-spm-click="gostr=/aliyun;locaid=" class=" common-header-clearfix"
                href="javascript:void(0);" sidebar-type="cdn">
                  存储与CDN
                  <span class="icon pull-right">
                  </span>
                </a>
                <a data-spm-click="gostr=/aliyun;locaid=" class=" common-header-clearfix"
                href="javascript:void(0);" sidebar-type="network">
                  网络
                  <span class="icon pull-right">
                  </span>
                </a>
                <a data-spm-click="gostr=/aliyun;locaid=" class=" common-header-clearfix"
                href="javascript:void(0);" sidebar-type="bigdata">
                  大规模计算
                  <span class="icon pull-right">
                  </span>
                </a>
                <a data-spm-click="gostr=/aliyun;locaid=" class=" common-header-clearfix"
                href="javascript:void(0);" sidebar-type="yundun">
                  云盾
                  <span class="icon pull-right">
                  </span>
                </a>
                <a data-spm-click="gostr=/aliyun;locaid=" class=" common-header-clearfix"
                href="javascript:void(0);" sidebar-type="manage">
                  管理与监控
                  <span class="icon pull-right">
                  </span>
                </a>
                <a data-spm-click="gostr=/aliyun;locaid=" class=" common-header-clearfix"
                href="javascript:void(0);" sidebar-type="service">
                  应用服务
                  <span class="icon pull-right">
                  </span>
                </a>
                <a data-spm-click="gostr=/aliyun;locaid=" class=" common-header-clearfix"
                href="javascript:void(0);" sidebar-type="middleware">
                  互联网中间件
                  <span class="icon pull-right">
                  </span>
                </a>
                <a data-spm-click="gostr=/aliyun;locaid=" class=" common-header-clearfix"
                href="javascript:void(0);" sidebar-type="mobileservice">
                  移动服务
                  <span class="icon pull-right">
                  </span>
                </a>
                <a data-spm-click="gostr=/aliyun;locaid=" class=" common-header-clearfix"
                href="javascript:void(0);" sidebar-type="domain">
                  域名与网站(万网)
                  <span class="icon pull-right">
                  </span>
                </a>
              </div>
              <div class="menu-dropdown-content">
                <!-- 下拉右侧内容 -->
                <!-- 模板一: -->
                <div style="display: block;background-image:url(./images/ecs-bg-x1.jpg);"
                class="item-sub ecs-bg tpl1 product-bg-common common-header-clearfix" sidebar-type="ecs">
                  <div class="menu-dropdown-bd menu-dropdown-split-line">
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/ecs/">
                        <h4>
                          云服务器 ECS
                        </h4>
                        <div class="desc">
                          可弹性扩展、安全稳定、简单易用的计算服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/disk/">
                        <h4>
                          块存储
                        </h4>
                        <div class="desc">
                          可弹性扩展、高性能、高可靠的块级随机存储 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/ace/">
                        <h4>
                          云引擎 ACE
                        </h4>
                        <div class="desc">
                          弹性、分布式的应用托管环境 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/ess/">
                        <h4>
                          弹性伸缩
                        </h4>
                        <div class="desc">
                          自动调整弹性计算资源的管理服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/containerservice/">
                        <h4>
                          容器服务(公测中)
                        </h4>
                        <div class="desc">
                          运行和管理 Docker容器 
                        </div>
                      </a>
                    </div>
                  </div>
                  <div class="menu-dropdown-bd">
                    <div class="menu-dropdown-down-item">
                      <h5 class="topic-hd">
                        最新特性
                      </h5>
                      <ul class="desc">
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/act/aliyun/gaoxiaoyunpan.html "
                          class="desc-li-txt">
                            ECS高效云盘上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/act/aliyun/usaaz2.html "
                          class="desc-li-txt">
                            ECS美国硅谷第二可用区开放 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/act/aliyun/singaporesale.html "
                          class="desc-li-txt">
                            ECS等10余款产品开放新加坡地域 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="http://help.aliyun.com/knowledge_detail.htm?knowledgeId=6527514 "
                          class="desc-li-txt">
                            ECS镜像共享功能上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="http://bbs.aliyun.com/read/241167.html " class="desc-li-txt">
                            SSD云盘和IO优化型实例免费公测 
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <!-- 模板二: -->
                <!-- 模板一: -->
                <div style="display: ;background-image:url(./images/database-bg-x1.jpg);"
                class="item-sub database-bg tpl1 product-bg-common common-header-clearfix"
                sidebar-type="database">
                  <div class="menu-dropdown-bd menu-dropdown-split-line">
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/rds/">
                        <h4>
                          云数据库 RDS
                        </h4>
                        <div class="desc">
                          完全兼容MySQL,SQLServer,PostgreSQL协议的关系型数据库服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/mongodb/">
                        <h4>
                          云数据库MongoDB版(公测中)
                        </h4>
                        <div class="desc">
                          三节点副本集保证高可用 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/ocs/">
                        <h4>
                          云数据库Memcache版
                        </h4>
                        <div class="desc">
                          在线缓存服务,为热点数据的访问提供高速响应 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/kvstore">
                        <h4>
                          云数据库Redis版
                        </h4>
                        <div class="desc">
                          兼容开源Redis协议的Key-Value类型在线存储服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/ads">
                        <h4>
                          分析型数据库
                        </h4>
                        <div class="desc">
                          海量数据实时高并发在线分析服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/dts/">
                        <h4>
                          数据传输(公测中)
                        </h4>
                        <div class="desc">
                          支持数据迁移及实时订阅同步的数据传输服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/dms/">
                        <h4>
                          数据管理(公测中)
                        </h4>
                        <div class="desc">
                          比phpMyAdmin更强大,比Navicat更易用 
                        </div>
                      </a>
                    </div>
                  </div>
                  <div class="menu-dropdown-bd">
                    <div class="menu-dropdown-down-item">
                      <h5 class="topic-hd">
                        最新特性
                      </h5>
                      <ul class="desc">
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/act/aliyun/rds_pgsql/demo.html?utm_content=m_1189 "
                          class="desc-li-txt">
                            新引擎PostgreSQL上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/product/ots/ " class="desc-li-txt">
                            北京地域、深圳地域OTS上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/?pos=1#/pub/drds/best-practice/best_data_import_export "
                          class="desc-li-txt">
                            引入模式&数据导入功能上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/act/aliyun/rds/cloud_dba.html "
                          class="desc-li-txt">
                            RDS云数据库管家上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/#/pub/drds/quick-start/console_use "
                          class="desc-li-txt">
                            DRDS实例化上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/product/mongodb " class="desc-li-txt">
                            MongoDB公测 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/product/kvstore " class="desc-li-txt">
                            Redis正式商用 
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <!-- 模板二: -->
                <!-- 模板一: -->
                <div style="display: ;background-image:url(./images/cdn-bg-x1.jpg);"
                class="item-sub cdn-bg tpl1 product-bg-common common-header-clearfix" sidebar-type="cdn">
                  <div class="menu-dropdown-bd menu-dropdown-split-line">
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/oss/">
                        <h4>
                          对象存储 OSS
                        </h4>
                        <div class="desc">
                          海量、安全和高可靠的云存储服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/disk/">
                        <h4>
                          块存储
                        </h4>
                        <div class="desc">
                          可弹性扩展、高性能、高可靠的块级随机存储 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/ots/">
                        <h4>
                          表格存储
                        </h4>
                        <div class="desc">
                          NoSQL数据存储服务,提供海量结构化数据的存储和实时访问 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/oas/">
                        <h4>
                          归档存储
                        </h4>
                        <div class="desc">
                          海量数据的长期归档、备份服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/mns">
                        <h4>
                          消息服务
                        </h4>
                        <div class="desc">
                          可靠、海量、高并发的分布式消息通知服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/cdn/">
                        <h4>
                          CDN
                        </h4>
                        <div class="desc">
                          跨运营商、跨地域全网覆盖的网络加速服务 
                        </div>
                      </a>
                    </div>
                  </div>
                  <div class="menu-dropdown-bd">
                    <div class="menu-dropdown-down-item">
                      <h5 class="topic-hd">
                        最新特性
                      </h5>
                      <ul class="desc">
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/ntms/actstorages.html "
                          class="desc-li-txt">
                            对象存储OSS预售资源包上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/?pos=1#/pub/oss/api-reference/access-control&amp;granting-permissions "
                          class="desc-li-txt">
                            临时访问凭证STS上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/?pos=2#/pub/oss/product-documentation/function&amp;lifecycle "
                          class="desc-li-txt">
                            生命周期管理功能上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/?#/pub/cdn/getting-started/monitor "
                          class="desc-li-txt">
                            新增流量监控和用户访问分析功能 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/?#/pub/cdn/getting-started/other "
                          class="desc-li-txt">
                            新增用户网络诊断工具 
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <!-- 模板二: -->
                <!-- 模板一: -->
                <div style="display: ;background-image:url(./images/TB10yLKKpXXXXaoaXXXfrUcUFXX-310-224.png);"
                class="item-sub network-bg tpl1 product-bg-common common-header-clearfix"
                sidebar-type="network">
                  <div class="menu-dropdown-bd menu-dropdown-split-line">
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/slb/">
                        <h4>
                          负载均衡
                        </h4>
                        <div class="desc">
                          对多台云服务器进行流量分发的负载均衡服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/vpc/">
                        <h4>
                          专有网络 VPC
                        </h4>
                        <div class="desc">
                          帮您轻松构建逻辑隔离的专有网络 
                        </div>
                      </a>
                    </div>
                  </div>
                  <div class="menu-dropdown-bd">
                    <div class="menu-dropdown-down-item">
                      <h5 class="topic-hd">
                        最新特性
                      </h5>
                      <ul class="desc">
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="http://help.aliyun.com/noticelist/articleid/6660943.html "
                          class="desc-li-txt">
                            专有网络(VPC)产品公告 
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <!-- 模板二: -->
                <!-- 模板一: -->
                <div style="display: ;background-image:url(./images/bigdata-bg-x1.jpg);"
                class="item-sub bigdata-bg tpl1 product-bg-common common-header-clearfix"
                sidebar-type="bigdata">
                  <div class="menu-dropdown-bd menu-dropdown-split-line">
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/odps/">
                        <h4>
                          大数据计算服务 ODPS
                        </h4>
                        <div class="desc">
                          针对TB/PB级数据的分布式处理服务,彻底解决大数据存储与运算瓶颈 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/batchcompute">
                        <h4>
                          批量计算(公测中)
                        </h4>
                        <div class="desc">
                          适用于大规模并行批处理作业的分布式云服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/cdp/">
                        <h4>
                          数据集成(公测中)
                        </h4>
                        <div class="desc">
                          稳定高效、弹性伸缩的数据同步平台 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/emapreduce">
                        <h4>
                          E-MapReduce(公测中)
                        </h4>
                        <div class="desc">
                          基于Hadoop/Spark的大数据处理分析服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/dpc">
                        <h4>
                          采云间(公测中)
                        </h4>
                        <div class="desc">
                          提供一站式数据开发和数据分析的平台。 
                        </div>
                      </a>
                    </div>
                  </div>
                  <div class="menu-dropdown-bd">
                    <div class="menu-dropdown-down-item">
                      <h5 class="topic-hd">
                        最新特性
                      </h5>
                      <ul class="desc">
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/?erQPgP#/pub/odps/dhs/summary "
                          class="desc-li-txt">
                            ODPS DataHub Service上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="http://blog.aliyun.com/2638 " class="desc-li-txt">
                            采云间新增了数据质量应用 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="http://blog.aliyun.com/2500?pos=14 " class="desc-li-txt">
                            数据集成控制台上线 
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <!-- 模板二: -->
                <!-- 模板一: -->
                <div class="item-sub yundun-bg product-bg-common tpl2" sidebar-type="yundun"
                style="display:none;background-image:url(./images/yundun-bg-x1.jpg);">
                  <div class="common-header-clearfix menu-dropdown-bd-wrap">
                    <div class="menu-dropdown-bd">
                      <div class="product-list common-header-clearfix">
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/sas/">
                            <h4>
                              态势感知
                            </h4>
                            <div class="desc">
                              安全大数据分析的威胁监测平台
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/ddosbasic/">
                            <h4>
                              基础防护
                              <span style='color:#999'>
                                [网络安全]
                              </span>
                            </h4>
                            <div class="desc">
                              提供基础DDoS防护和应用防护
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/ddos/">
                            <h4>
                              DDoS高防IP
                              <span style='color:#999'>
                                [网络安全]
                              </span>
                            </h4>
                            <div class="desc">
                              提供最高300G防护,按天计算
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/esn/">
                            <h4>
                              安全网络
                              <span style='color:#999'>
                                [网络安全]
                              </span>
                            </h4>
                            <div class="desc">
                              集安全/加速/负载均衡为一体的网络接入产品
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/aegis/">
                            <h4>
                              安骑士
                              <span style='color:#999'>
                                [服务器安全]
                              </span>
                            </h4>
                            <div class="desc">
                              服务器安全管理中心
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/vipaegis/">
                            <h4>
                              补丁管理
                              <span style='color:#999'>
                                [服务器安全]
                              </span>
                            </h4>
                            <div class="desc">
                              自研漏洞补丁,云端一键修复漏洞
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/antifraud/">
                            <h4>
                              反欺诈
                              <span style='color:#999'>
                                [业务安全]
                              </span>
                            </h4>
                            <div class="desc">
                              风险业务用户核实、防垃圾注册和营销作弊等服务
                            </div>
                          </a>
                        </div>
                      </div>
                    </div>
                    <div class="menu-dropdown-bd">
                      <div class="product-list common-header-clearfix">
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/lvwang/">
                            <h4>
                              绿网
                              <span style='color:#999'>
                                [内容安全]
                              </span>
                            </h4>
                            <div class="desc">
                              专注违规信息安全监测及管控
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/cdi/">
                            <h4>
                              内容检测API
                              <span style='color:#999'>
                                [内容安全]
                              </span>
                            </h4>
                            <div class="desc">
                              智能化色情、暴恐、垃圾等信息检测开放服务
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/hsm/">
                            <h4>
                              加密服务(公测中)
                              <span style='color:#999'>
                                [数据安全]
                              </span>
                            </h4>
                            <div class="desc">
                              云上用户的数据加密解决方案
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/aps/">
                            <h4>
                              渗透测试
                              <span style='color:#999'>
                                [专家服务]
                              </span>
                            </h4>
                            <div class="desc">
                              专业性入侵尝试,评估重大安全漏洞或隐患
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/ats/">
                            <h4>
                              网络安全专家服务
                              <span style='color:#999'>
                                [专家服务]
                              </span>
                            </h4>
                            <div class="desc">
                              私家定制的攻防重保
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/xianzhi/">
                            <h4>
                              先知计划(公测中)
                              <span style='color:#999'>
                                [专家服务]
                              </span>
                            </h4>
                            <div class="desc">
                              帮助企业建立“私有”漏洞收集中心
                            </div>
                          </a>
                        </div>
                        <div class="menu-dropdown-down-item">
                          <a href="#/product/mss/">
                            <h4>
                              服务器安全托管
                              <span style='color:#999'>
                                [专家服务]
                              </span>
                            </h4>
                            <div class="desc">
                              专属安全团队保障零入侵
                            </div>
                          </a>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="item-sub-ft common-header-clearfix">
                    <div class="menu-dropdown-down-item">
                      <h4 class="tpl2-content-ft">
                        最新特性
                      </h4>
                      <ul class="desc common-header-clearfix">
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/product/antifraud/ " class="desc-li-txt">
                            反欺诈服务上线 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/product/mss " class="desc-li-txt">
                            安骑士推出云托管服务 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/product/ats " class="desc-li-txt">
                            DDoS推出专家服务 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="http://blog.aliyun.com/2703 " class="desc-li-txt">
                            应用防火墙接入恢复 
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <!-- 模板三: -->
                <!-- 模板一: -->
                <div style="display: ;background-image:url(./images/manage-bg-x1.jpg);"
                class="item-sub manage-bg tpl1 product-bg-common common-header-clearfix"
                sidebar-type="manage">
                  <div class="menu-dropdown-bd menu-dropdown-split-line">
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/jiankong/">
                        <h4>
                          云监控
                        </h4>
                        <div class="desc">
                          指标监控与报警服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/ram/">
                        <h4>
                          访问控制(公测中)
                        </h4>
                        <div class="desc">
                          支持细粒度多纬度授权的访问控制服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/ros/">
                        <h4>
                          资源编排(公测中)
                        </h4>
                        <div class="desc">
                          批量创建、管理、配置云计算资源 
                        </div>
                      </a>
                    </div>
                  </div>
                  <div class="menu-dropdown-bd">
                    <div class="menu-dropdown-down-item">
                      <h5 class="topic-hd">
                        最新特性
                      </h5>
                      <ul class="desc">
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/product/ram/ " class="desc-li-txt">
                            访问控制 RAM 开始公测 
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <!-- 模板二: -->
                <!-- 模板一: -->
                <div style="display: ;background-image:url(./images/service-bg-x1.jpg);"
                class="item-sub service-bg tpl1 product-bg-common common-header-clearfix"
                sidebar-type="service">
                  <div class="menu-dropdown-bd menu-dropdown-split-line">
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/sls/">
                        <h4>
                          日志服务(公测中)
                        </h4>
                        <div class="desc">
                          针对日志收集、存储、查询和分析的服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/opensearch/">
                        <h4>
                          开放搜索
                        </h4>
                        <div class="desc">
                          结构化数据搜索托管服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/mts/">
                        <h4>
                          媒体转码
                        </h4>
                        <div class="desc">
                          为多媒体数据提供的转码计算服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/pts/">
                        <h4>
                          性能测试
                        </h4>
                        <div class="desc">
                          性能云测试平台,帮您轻松完成系统性能评估 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/directmail">
                        <h4>
                          邮件推送
                        </h4>
                        <div class="desc">
                          事务邮件、通知邮件、批量邮件的推送服务 
                        </div>
                      </a>
                    </div>
                  </div>
                  <div class="menu-dropdown-bd">
                    <div class="menu-dropdown-down-item">
                      <h5 class="topic-hd">
                        最新特性
                      </h5>
                      <ul class="desc">
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/#/pub/pts/record-tool-guide/record-tool-guide "
                          class="desc-li-txt">
                            性能测试性能脚本录制调试功能上线 
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <!-- 模板二: -->
                <!-- 模板一: -->
                <div style="display: ;background-image:url(./images/TB11EbPKpXXXXbUXVXXYMcuQVXX-375-260.png);"
                class="item-sub middleware-bg tpl1 product-bg-common common-header-clearfix"
                sidebar-type="middleware">
                  <div class="menu-dropdown-bd menu-dropdown-split-line">
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/edas">
                        <h4>
                          企业级分布式应用服务 EDAS
                        </h4>
                        <div class="desc">
                          以应用为中心的中间件PaaS平台 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/ons/">
                        <h4>
                          消息队列(公测中)
                        </h4>
                        <div class="desc">
                          基于阿里开源消息中间件MetaQ的云消息产品 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/drds/">
                        <h4>
                          分布式关系型数据库服务 DRDS
                        </h4>
                        <div class="desc">
                          水平拆分/读写分离的在线分布式数据库服务 
                        </div>
                      </a>
                    </div>
                  </div>
                  <div class="menu-dropdown-bd">
                    <div class="menu-dropdown-down-item">
                      <h5 class="topic-hd">
                        最新特性
                      </h5>
                      <ul class="desc">
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="http://onsteam.oss-cn-hangzhou.aliyuncs.com/ALIYUN_ONS_USER_GUIDE.pdf "
                          class="desc-li-txt">
                            消息队列mqtt功能公测 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="http://bbs.aliyun.com/read/247144.html " class="desc-li-txt">
                            消息队列新功能推广 
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <!-- 模板二: -->
                <!-- 模板一: -->
                <div style="display: ;background-image:url(./images/TB159fNLXXXXXccXXXXXXXXXXXX-309-223.jpg);"
                class="item-sub mobileservice-bg tpl1 product-bg-common common-header-clearfix"
                sidebar-type="mobileservice">
                  <div class="menu-dropdown-bd menu-dropdown-split-line">
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/man">
                        <h4>
                          移动数据分析(公测中)
                        </h4>
                        <div class="desc">
                          移动应用数据采集、分析、展示和数据输出服务 
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="#/product/cps">
                        <h4>
                          移动推送(公测中)
                        </h4>
                        <div class="desc">
                          移动应用通知与消息推送服务 
                        </div>
                      </a>
                    </div>
                  </div>
                  <div class="menu-dropdown-bd">
                    <div class="menu-dropdown-down-item">
                      <h5 class="topic-hd">
                        最新特性
                      </h5>
                      <ul class="desc">
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/product/man " class="desc-li-txt">
                            移动数据分析上线公测 
                          </a>
                        </li>
                        <li>
                          <i class="list-style">
                            ●
                          </i>
                          <a target="_blank" href="#/product/cps " class="desc-li-txt">
                            移动推送上线公测 
                          </a>
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <!-- 模板二: -->
                <!-- 模板一: -->
                <div class="item-sub domain-bg product-bg-common tpl3" sidebar-type="domain"
                style="display:none;background-image:url(./images/domain-bg-x1.jpg);">
                  <div class="item-sub-hd common-header-clearfix">
                    <div class="menu-dropdown-down-item ">
                      <h4>
                        <a href="http://wanwang.aliyun.com/domain/">
                          域名注册
                        </a>
                      </h4>
                      <div class="item-name domain-regist-item">
                        <a href="http://wanwang.aliyun.com/domain/com/">
                          .com
                        </a>
                        <a href="http://wanwang.aliyun.com/domain/newgtld/?#.wang">
                          .wang
                          <span class="is-new">
                            <img src="./images/TB1afqGGpXXXXcEXVXX5ujgGFXX-39-20.png"
                            width="20" height="10" />
                          </span>
                        </a>
                        <a href="http://wanwang.aliyun.com/domain/cn/">
                          .cn
                        </a>
                        <a href="http://wanwang.aliyun.com/domain/newgtld/?#.top">
                          .top
                          <span class="is-new">
                            <img src="./images/TB1afqGGpXXXXcEXVXX5ujgGFXX-39-20.png"
                            width="20" height="10" />
                          </span>
                        </a>
                        <a href="http://wanwang.aliyun.com/domain/net/">
                          .net
                        </a>
                        <a href="http://wanwang.aliyun.com/domain/newgtld/?#.xyz">
                          .xyz
                        </a>
                      </div>
                      <div class="menu-dropdown-down-item-ft domain-more">
                        <a href="http://wanwang.aliyun.com/domain/">
                          更多域名选择>>
                        </a>
                      </div>
                    </div>
                    <div class="menu-dropdown-down-item ">
                      <h4>
                        <a href="http://wanwang.aliyun.com/domain/#3">
                          域名转入与交易
                        </a>
                      </h4>
                      <div class="item-name domain-exchange-item">
                        <a href="http://wanwang.aliyun.com/domain/transfer/">
                          域名转入
                        </a>
                        <a href="http://tdomain.aliyun.com/taodomainmarket/home">
                          淘域名市场
                        </a>
                        <a href="http://wanwang.aliyun.com/domain/apricequeries/">
                          一口价二手域名
                        </a>
                      </div>
                    </div>
                  </div>
                  <div class="tpl3-split-line">
                  </div>
                  <div class="item-sub-ft common-header-clearfix">
                    <div class="menu-dropdown-down-item">
                      <a href="http://wanwang.aliyun.com/hosting/">
                        <h4>
                          云虚拟主机
                        </h4>
                        <div class="desc">
                          建站主机,环境预装
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="http://wanwang.aliyun.com/hosting/elastic/">
                        <h4>
                          弹性Web托管(弹性虚机)
                        </h4>
                        <div class="desc">
                          新一代虚机,独享内存,高性价比
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="http://wanwang.aliyun.com/domain/dns/">
                        <h4>
                          云解析
                        </h4>
                        <div class="desc">
                          域名解析,安全、稳定、极速、开放
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="http://wanwang.aliyun.com/mail/">
                        <h4>
                          云邮箱
                        </h4>
                        <div class="desc">
                          极速、安全、多端,办公协同新体验
                        </div>
                      </a>
                    </div>
                    <div class="menu-dropdown-down-item">
                      <a href="http://market.aliyun.com/jianzhan/">
                        <h4>
                          企业建站
                        </h4>
                        <div class="desc">
                          海量模板与定制网站任您选
                        </div>
                      </a>
                    </div>
                  </div>
                </div>
                <!-- 模板一: -->
              </div>
            </div>
          </div>
        </li>
        <li class="top-menu-item" has-dropdown="true" menu-type="solution" data-spm-click="gostr=/aliyun;locaid=">
          <span class="menu-hd">
            解决方案
          </span>
          <div class="menu-dropdown solutions solution-bg">
            <div class="menu-dropdown-inner module-padding solution-inner common-header-clearfix">
              <div class="module-wrap " style="width:180px">
                <div class="module-hd">
                  通用解决方案
                </div>
                <div class="module-bd">
                  <a href="#/solution/web/" target="_self">
                    网站解决方案
                  </a>
                  <a href="#/solution/security/" target="_self">
                    安全解决方案
                  </a>
                  <a href="#/solution/storage/" target="_self">
                    云存储解决方案
                  </a>
                  <a href="#/solution/app/" target="_self">
                    移动APP解决方案
                  </a>
                  <a href="#/solution/recovery" target="_self">
                    中小型应用容灾方案
                  </a>
                </div>
              </div>
              <div class="module-wrap last" style="">
                <div class="module-hd">
                  行业解决方案
                </div>
                <div class="module-bd">
                  <a href="http://media.aliyun.com/" target="_self">
                    多媒体解决方案
                  </a>
                  <a href="#/solution/finance" target="_self">
                    金融解决方案
                  </a>
                  <a href="#/solution/game" target="_self">
                    游戏解决方案
                  </a>
                  <a href="http://healthcare.aliyun.com/" target="_self">
                    医疗解决方案
                  </a>
                  <a href="#/solution/ecommerce/" target="_self">
                    电商解决方案
                  </a>
                  <a href="http://govcloud.aliyun.com/" target="_self">
                    政务解决方案
                  </a>
                  <a href="http://rendering.aliyun.com/" target="_self">
                    渲染解决方案
                  </a>
                  <a href="#/solution/iot/" target="_self">
                    物联网解决方案
                  </a>
                  <a href="#/solution/o2o/" target="_self">
                    O2O解决方案
                  </a>
                </div>
              </div>
            </div>
          </div>
        </li>
        <li class="top-menu-item" has-dropdown="false" menu-type="" data-spm-click="gostr=/aliyun;locaid=d20145">
          <a target="_blank" class="menu-hd top-menu-item-link" data-spm-click="gostr=/aliyun;locaid=d20145"
          href="http://market.aliyun.com">
            云市场
          </a>
        </li>
        <li class="top-menu-item" has-dropdown="true" menu-type="dev" data-spm-click="">
          <a class="menu-hd" href="#/" target="_blank">
            开发者社区
          </a>
          <div class="menu-dropdown solutions dev-bg">
            <div class="menu-dropdown-inner module-padding dev-inner common-header-clearfix">
              <div class="module-wrap " style="">
                <div class="module-hd">
                  资源
                </div>
                <div class="module-bd">
                  <a href="https://help.aliyun.com/" target="true">
                    帮助与文档
                  </a>
                  <a href="http://develop.aliyun.com/api/" target="_self">
                    API
                  </a>
                  <a href="http://develop.aliyun.com/sdk/java/" target="_self">
                    SDK
                  </a>
                  <a href="http://develop.aliyun.com/command/cli" target="_self">
                    开发者工具
                  </a>
                  <a href="http://develop.aliyun.com/whitepaper/" target="_self">
                    解决方案白皮书
                  </a>
                </div>
              </div>
              <div class="module-wrap " style="">
                <div class="module-hd">
                  <a href="#/articles/?sort=yuan" target="true">
                    博客
                  </a>
                </div>
                <div class="module-bd">
                  <a href="#/teams/" target="true">
                    团队博客
                  </a>
                  <a href="#/articles/?sort=yuan" target="true">
                    个人博客
                  </a>
                </div>
              </div>
              <div class="module-wrap " style="">
                <div class="module-hd">
                  <a href="http://bbs.aliyun.com/" target="true">
                    论坛
                  </a>
                </div>
                <div class="module-bd">
                  <a href="http://bbs.aliyun.com/fourms.php?&m=bbs&cateid=33" target="true">
                    产品讨论
                  </a>
                  <a href="http://bbs.aliyun.com/fourms.php?&m=bbs&cateid=293" target="true">
                    架构师中心
                  </a>
                  <a href="http://bbs.aliyun.com/fourms.php?&m=bbs&cateid=227" target="true">
                    云生态
                  </a>
                </div>
              </div>
              <div class="module-wrap " style="">
                <div class="module-hd">
                  <a href="#/ask" target="true">
                    问答
                  </a>
                </div>
                <div class="module-bd">
                  <a href="#/ask/?&type=aliyun" target="true">
                    产品求助
                  </a>
                  <a href="#/ask/?tag=6" target="true">
                    数据库
                  </a>
                </div>
              </div>
              <div class="module-wrap " style="">
                <div class="module-hd">
                  <a href="#/edu/lesson" target="true">
                    学院
                  </a>
                </div>
                <div class="module-bd">
                  <a href="#/edu/lesson/?type=category&cid=1" target="true">
                    公开课
                  </a>
                  <a href="#/edu/lesson/?type=category&cid=5" target="true">
                    技术人生
                  </a>
                </div>
              </div>
              <div class="module-wrap last" style="">
                <div class="module-hd">
                  活动
                </div>
                <div class="module-bd">
                  <a href="#/" target="true">
                    云栖大会
                  </a>
                  <a href="#/yunqitech/6/" target="_self">
                    云栖Techday
                  </a>
                  <a href="https://13141618.taobao.com/" target="_self">
                    创客活动
                  </a>
                  <a href="http://tianchi.aliyun.com/" target="true">
                    数据大赛(天池)
                  </a>
                </div>
              </div>
            </div>
          </div>
        </li>
        <li class="top-menu-item" has-dropdown="true" menu-type="training" data-spm-click="">
          <a class="menu-hd" href="#/support" target="_self">
            服务与培训
          </a>
          <div class="menu-dropdown solutions training-bg">
            <div class="menu-dropdown-inner module-padding training-inner common-header-clearfix">
              <div class="module-wrap " style="width:200px">
                <div class="module-hd">
                  服务与支持
                </div>
                <div class="module-bd">
                  <a href="#/support/jpfw" target="_self">
                    金牌服务
                  </a>
                  <a href="#/support/techsupport" target="_self">
                    售后支持
                  </a>
                  <a href="#/support/service/list" target="_self">
                    尊享服务
                  </a>
                </div>
              </div>
              <div class="module-wrap " style="width:200px">
                <div class="module-hd">
                  <a href="#/support/training" target="_self">
                    培训与认证
                  </a>
                </div>
                <div class="module-bd">
                  <a href="#/support/video" target="_self">
                    视频课程
                  </a>
                  <a href="#/support/courses" target="_self">
                    培训课程
                  </a>
                  <a href="#/support/certification" target="_self">
                    考试认证
                  </a>
                </div>
              </div>
              <div class="module-wrap last" style="width:200px">
                <div class="module-hd">
                  <a href="http://help.aliyun.com/" target="true">
                    帮助与文档
                  </a>
                </div>
                <div class="module-bd">
                  <a href="http://help.aliyun.com/" target="true">
                    文档与常见问题
                  </a>
                  <a href="http://help.aliyun.com/contact/school.htm" target="true">
                    新手学堂
                  </a>
                  <a href="http://help.aliyun.com/contact/service.htm" target="true">
                    自助服务
                  </a>
                </div>
              </div>
            </div>
          </div>
        </li>
        <li class="top-menu-item" has-dropdown="true" menu-type="aliplus" data-spm-click="">
          <span class="menu-hd">
            合作与生态
          </span>
          <div class="menu-dropdown solutions aliplus-bg">
            <div class="menu-dropdown-inner module-padding aliplus-inner common-header-clearfix">
              <div class="module-wrap " style="width:250px">
                <div class="module-hd">
                  云合作
                </div>
                <div class="module-bd">
                  <a href="#/list/solution.html" target="_self">
                    解决方案合作
                  </a>
                  <a href="#/list/cloud.html" target="_self">
                    云服务合作
                  </a>
                  <a href="#/list/technical.html" target="_self">
                    技术平台合作
                  </a>
                  <a href="#/list/channel.html" target="_self">
                    渠道服务合作
                  </a>
                  <a href="#/shumeng" target="_self">
                    数梦工场合作
                  </a>
                  <a href="#/act/aliyun/cps.html" target="_self">
                    CPS推广合作
                  </a>
                </div>
              </div>
              <div class="module-wrap " style="width:250px">
                <div class="module-hd">
                  云扶持
                </div>
                <div class="module-bd">
                  <a href="#/act/aliyun/gamealliance.html" target="true">
                    行业扶持
                  </a>
                  <a href="#/act/aliyun/campus.html" target="true">
                    学生扶持
                  </a>
                  <a href="#/tmsact/aliyun/2015/newbes.html" target="true">
                    新手扶持
                  </a>
                  <a href="#/aliyun.html" target="true">
                    企业小额贷款
                  </a>
                </div>
              </div>
              <div class="module-wrap last" style="width:250px">
                <div class="module-hd">
                  <a href="#/chuangke/sy.html" target="_self">
                    创客+
                  </a>
                </div>
                <div class="module-bd">
                  <a href="#/chuangke/rz.html" target="_self">
                    融资申请
                  </a>
                  <a href="#/chuangke/fh.html" target="_self">
                    孵化器/园区入驻
                  </a>
                  <a href="#/" target="_self">
                    线下活动
                  </a>
                </div>
              </div>
            </div>
          </div>
        </li>
      </ul>
    </div>
  </div>
</div>
</body>
</html>








JS代码(common-header.js):

!function(){
	function a(a,b){
	var c=document.createElement("script");
	c.type="text/javascript",c.readyState?c.onreadystatechange=function(){
	("loaded"==c.readyState||"complete"==c.readyState)&&(c.onreadystatechange=null,b())}
:c.onload=function(){
	b()}
,c.src=a,document.getElementsByTagName("head")[0].appendChild(c)}
function b(){
	function a(){
	$(".menu .menu-dropdown").css({
	width:1200-c.position().left+"px"}
)}
function b(){
	var a,b,c=$(".menu-dropdown-sidebar").find("a"),d=$(".item-sub[sidebar-type]");
	return{
	eventBind:function(){
	this.initStatus();
	var d=null;
	c.mouseenter(function(){
	var c=$(this);
	c.data("enterTime",(new Date).getTime()),c!=b&&(d=setTimeout(function(){
	b.removeClass("active"),c.addClass("active"),b=c;
	var d=c.attr("sidebar-type"),e=$('.item-sub[sidebar-type="'+d+'"]');
	a.hide(),e.show(),a=e,c.parents(".menu-dropdown").css({
	height:e.height()+20+"px"}
)}
,200))}
).mouseleave(function(){
	var a=$(this),b=parseInt(a.data("enterTime")||0,10),c=(new Date).getTime();
	200>=c-b&&d&&(clearTimeout(d),d=null)}
),$("#J_common_header_menu .menu-dropdown-content").mouseenter(function(a){
	d&&(clearTimeout(d),d=null)}
)}
,initStatus:function(){
	c.removeClass("active"),d.hide(),a=$(".item-sub[sidebar-type]").eq(0).show(),b=f.eq(0).addClass("active")}
}
}
var c=($("#J_common_header_search_wrap"),$("#J_common_header_menu")),d=$(window).width();
	a(),$(window).resize(function(){
	a(),d=$(window).width()}
);
	var e=null,f=$(".menu-dropdown-sidebar").find("a");
	$(".item-sub[sidebar-type]").eq(0);
	$("#J_common_header_menu .top-menu-item").mouseenter(function(){
	var a,b=null,c=$(this);
	(a=c.data("mouseoutTimer"))&&(clearTimeout(a),a=null),c.data("enterTime",(new Date).getTime()),b=setTimeout(function(){
	e&&(clearTimeout(e),e=null);
	var a="true"===c.attr("has-dropdown"),b=c.attr("menu-type");
	if(a){
	var d=c.parent().position(),f=c.position(),g=c.find(".menu-dropdown");
	g.css({
	left:-(f.left-d.left)+"px"}
);
	var h=g.find(".menu-dropdown-inner").height();
	"product"!=b&&(h+=47),g.addClass("animate").css({
	height:h+"px",zIndex:1}
)}
}
,200),c.data("mouseoverTimter",b)}
).mouseleave(function(a){
	var c=$(this),d=parseInt(c.data("enterTime")||0,10),e=(new Date).getTime(),f=c.data("mouseoverTimter");
	200>=e-d&&f&&(clearTimeout(f),f=null);
	var g="true"===c.attr("has-dropdown");
	if(g){
	var h=setTimeout(function(){
	var a=c.find(".menu-dropdown");
	a.removeClass("animate").css({
	height:0,zIndex:0}
),c.data("showing",!1),b.initStatus(),f&&(clearTimeout(f),f=null)}
,100);
	c.data("mouseoutTimer",h)}
}
),b=b(),b.eventBind()}
function c(a,b,c,d){
	function e(){
	try{
	new ActiveXObject("ShockwaveFlash.ShockwaveFlash");
	return!0}
catch(a){
	try{
	var b=navigator.plugins["Shockwave Flash"];
	return void 0==b?!1:!0}
catch(c){
	return!1}
}
}
var f;
	d.length&&(f=d.attr("activity-url"))&&0==d.find("a").length&&d.append('<a style="opacity:0;
	filter:alpha(opacity=0);
	" href="'+f+'" target="_blank">阿里云</a>'),document.all&&$(".activity .link a").css({
	background:"#00a2ca",filter:"alpha(opacity=0)"}
);
	var g=$(a).attr("only-home"),h=$(a).attr("flash-src");
	if(e()){
	var i='<object style="position:absolute;
	left:0;
	right:0;
	" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="'+b+'" height="'+c+'"><param name="movie" value="'+h+'"><param name="quality" value="high"><param name="wmode" value="transparent"><param name="scale" value="noscale"><embed src="'+h+'" width="'+b+'" height="'+c+'" scale="noscale" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent"></embed></object>',j=window.location;
	g?j.host+j.pathname=="www.aliyun.com/"&&$(a).html(i):$(a).html(i)}
}
function d(a){
	a.length&&0==a.find("a").length&&a.append('<a href="http://wanwang.aliyun.com/" style="height:60px;
	background:#00a2ca;
	padding-top:0;
	right:0px;
	" target="_blank"><image width="114" height="60" src="//gtms02.alicdn.com/tps/i2/TB1Xy2.IpXXXXcVXpXXAwng6FXX-230-124.png" /></a>')}
function e(){
	$(function(){
	if(0!=$("#J_common_header_menu").length){
	b();
	var a=$("#J-activity-url");
	"wanwang.aliyun.com"==window.location.hostname?d(a):c("#J-ali-activity",230,62,a)}
}
)}
window.jQuery?e():a("//g.alicdn.com/aliyun/www-dpl/0.3.32/knight/js/base-all.js",function(){
	e()}
)}
();
	

CSS代码(global.css):

@charset "utf-8";html{color:#333;background:#fff;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
audio,canvas,video{display:inline-block;*display:inline;*zoom:1}
body,button,input,select,textarea{font:12px/1.5 "\5FAE\8F6F\96C5\9ED1","Microsoft Yahei","Hiragino Sans GB",tahoma,arial,"\5B8B\4F53"}
input,select,textarea{font-size:100%}
table{border-collapse:collapse;border-spacing:0}
fieldset,img{border:0}
iframe{display:block}
abbr,acronym{border:0;font-variant:normal}
del{text-decoration:line-through}
i{font-style:normal}
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-weight:500;color:#000}
h1{font-size:24px}
h2{font-size:16px}
h3,h4,h5,h6{font-size:14px}
q:before,q:after{content:''}
sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}
sup{top:-.5em}
sub{bottom:-.25em}
ins,a{text-decoration:none}
a,.y-lnk,.y-lnk-gray,.y-lnk-highlight{-webkit-transition:color .2s;-moz-transition:color .2s;-ms-transition:color .2s;-o-transition:color .2s}
a,a:link,a:visited,a:hover{color:#00a2ca}
.y-lnk-highlight,.y-lnk-highlight:link,.y-lnk-highlight:visited{color:#f60}
.y-lnk-highlight:hover{color:#f60}
.y-lnk,.y-lnk:link,.y-lnk:visited{color:#000}
.y-lnk:hover{color:#00a2ca}
.y-lnk-gray,.y-lnk-gray:link,.y-lnk-gray:visited{color:#666}
.y-lnk-gray:hover{color:#00a2ca}
.y-lnk-highlight,.y-lnk,.y-lnk-gray{cursor:pointer}
a:hover,.y-lnk-highlight:hover,.y-lnk:hover,.y-lnk-gray:hover{text-decoration:underline}
.y-clear:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}
.y-clear{zoom:1}
.y-cny{font-family:arial}
body .fn-hide{display:none}
.y-align-right{text-align:right!important}
.y-align-left{text-align:left!important}
.y-align-center{text-align:center!important}
.y-left,.y-right{display:inline}
.y-left{float:left!important}
.y-right{float:right!important}
.y-hide{display:none!important}
.y-red{color:#e00}
.y-orange{color:#f60}
.y-blue{color:#00a2ca}
.y-green{color:#390}
.y-black{color:#000}
.y-dark{color:#333}
.y-gray{color:#666}
.y-pale{color:#999}
.y-light{color:#ccc}
.y-mt1{margin-top:4px}
.y-mt2{margin-top:8px}
.y-mt3{margin-top:12px}
.y-mt4{margin-top:16px}
.y-mt5{margin-top:20px}
.y-mr1{margin-right:4px}
.y-mr2{margin-right:8px}
.y-mr3{margin-right:12px}
.y-mr4{margin-right:16px}
.y-mr5{margin-right:20px}
.y-ml1{margin-left:4px}
.y-ml2{margin-left:8px}
.y-ml3{margin-left:12px}
.y-ml4{margin-left:16px}
.y-ml5{margin-left:20px}
.y-pb1{padding-bottom:4px}
.y-pb2{padding-bottom:8px}
.y-pb3{padding-bottom:12px}
.y-pb4{padding-bottom:16px}
.y-pb5{padding-bottom:20px}
.y-row{min-width:1000px;max-width:1200px;margin-left:auto;margin-right:auto;zoom:1;*width:1000px}
.y-row:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}
.y-row-edge{padding-left:10px;padding-right:10px;*padding-left:0;*padding-right:0}
.y-row .y-span1,.y-row .y-span2,.y-row .y-span3,.y-row .y-span4,.y-row .y-span5,.y-row .y-span6,.y-row .y-span7,.y-row .y-span8,.y-row .y-span9,.y-row .y-span10,.y-row .y-span11,.y-row .y-span12{float:left;display:inline;margin-right:2%;*margin-right:20px}
.y-row .y-span1{width:6.5%;*width:65px}
.y-row .y-span2{width:15%;*width:150px}
.y-row .y-span3{width:23.5%;*width:235px}
.y-row .y-span4{width:32%;*width:320px}
.y-row .y-span5{width:40.5%;*width:405px}
.y-row .y-span6{width:49%;*width:490px}
.y-row .y-span7{width:57.5%;*width:575px}
.y-row .y-span8{width:66%;*width:660px}
.y-row .y-span9{width:74.5%;*width:745px}
.y-row .y-span10{width:83%;*width:830px}
.y-row .y-span11{width:91.5%;*width:915px}
.y-row .y-span12{width:100%;*width:1000px}
.y-row .y-last{margin-right:0!important}
附件:下载该文件资源,减少时间成本(增值服务)
留言
该资源可下载
File Source
.rar
454.69 KB
Html Js 菜单导航特效6
最新结算
股权转让协议意向书模板
类型: .docx 金额: CNY 2.23¥ 状态: 待结算 详细>
股权转让协议意向书模板
类型: .docx 金额: CNY 0.28¥ 状态: 待结算 详细>
CSS3图片向上3D翻转渐隐消失特效
类型: .rar 金额: CNY 0.29¥ 状态: 待结算 详细>
CSS3图片向上3D翻转渐隐消失特效
类型: .rar 金额: CNY 2.31¥ 状态: 待结算 详细>
.net c# 将金额转人名币大写金额
类型: .rar 金额: CNY 2.39¥ 状态: 待结算 详细>
.net c# 将金额转人名币大写金额
类型: .rar 金额: CNY 0.3¥ 状态: 待结算 详细>
合伙退伙协议书范本模板
类型: .doc 金额: CNY 2.23¥ 状态: 待结算 详细>
合伙退伙协议书范本模板
类型: .doc 金额: CNY 0.28¥ 状态: 待结算 详细>
合伙退伙协议书范本模板
类型: .doc 金额: CNY 2.23¥ 状态: 待结算 详细>
合伙退伙协议书范本模板
类型: .doc 金额: CNY 0.28¥ 状态: 待结算 详细>
我们力求给您提供有用的文章,再此基础上,会附加营收资源,不做任何广告,让平台可以更好发展 若您发现您的权利被侵害,或使用了您的版权,请发邮件联系 sunlifel@foxmail.com ggbig觉得 : 不提供源码的文章不是好文章
合作伙伴
联系我们
  • QQ:21499807
  • 邮箱:sunlifel@foxmail.com
  • QQ扫一扫加QQ
    QQ扫一扫
Copyright 2023-2024 ggbig.com·皖ICP备2023004211号-1
打赏文章