communauté
Apprendre
Bibliothèque d'outils
Outils d'IA
Loisirs
recherche
Français
javascript - Google peut tuer complètement IE directement. IE11 semble être efficace dans Hanlan. La barre latérale ne peut pas être rétractée ou rétractée. Veuillez résoudre ce problème pour les novices en matière de compatibilité IE.
为情所困
为情所困 2017-05-19 10:35:10
0
2
543

<!DOCTYPE html>
<html lang="fr">

<head>
    <meta charset="UTF-8">
    <meta name=“keywords” content=“”>
    <meta name=“description” content=“”>
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="CSS/shouye.css">
    <title></title>
</head>

<body>
    <!--导航栏部分-->
    <p class="nav">
        <p class="box">
            <a href="#" class="a1"></a>
            <a href="#" class="a2"></a>
            <a href="#" class="a3"></a>
            <a href="#" class="a4"></a>
            <a href="#" class="a5"></a>
            <a href="#" class="a6"></a>
        </p>
    </p>

    <!--左收放侧边栏(三级)-->
    <p class="leftNav">
        <!--一级-->
        <ul class="ulBox1">
            <li class="xitong">
                <a href="#">系统管理</a>
                <!--二级-->
                <ul class="ulBox2">
                    <!--第一项,用户-->
                    <li class="yonghu2"><i class="yonghu1-1"></i><a href="#">用户管理</a></li>
                    <!--第二项,基础-->
                    <li class="jichu2"><i class="jichu2-1"></i><a href="#">基础资料</a>
                        <!--三级-->
                        <ul class="jichu2-2">
                            <li class="kehu3"><i class="kehu3-1"></i><a href="#">客户</a></li>
                            <li class="gongying3"><i class="gongying3-1"></i><a href="#">供应商</a></li>
                            <li class="chanping3"><i class="chanping3-1"></i><a href="#">产品</a></li>
                        </ul>
                    </li>
                    <!--第三项,销售-->
                    <li class="xiaoshou2"><i class="xiaoshou2-1"></i><a href="#">销售订单</a>
                        <!--三级-->
                        <ul class="xiaoshou2-2">
                            <li class="dingdan3"><i class="dingdan3-1"></i><a href="#">订单</a></li>
                            <li class="baobiao3"><i class="baobiao3-1"></i><a href="#">报表</a></li>
                        </ul>
                    </li>
                    <!--第四项,采购-->
                    <li class="caigou2"><i class="caigou2-1"></i><a href="#">采购</a>
                        <!--三级-->
                        <ul class="caigou2-2">
                            <li class="jihua3"><i class="jihua3-1"></i><a href="#">计划</a></li>
                            <li class="baobiao3-2"><i class="baobiao3-2-1"></i><a href="#">报表</a></li>
                        </ul>
                    </li>
                    <!--第五项,生产-->
                    <li class="shengchan2"><i class="shengchan2-1"></i><a href="#">生产</a>
                        <!--三级-->
                        <ul class="shengchan2-2">
                            <li class="shengcan3"><i class="shengchan3-1"></i><a href="#">生产</a></li>
                            <li class="baobiao3-3"><i class="baobiao3-3-1"></i><a href="#">报表</a></li>
                        </ul>
                    </li>
                    <!--第六项,库存-->
                    <li class="kucun2"><i class="kucun2-1"></i><a href="#">库存</a>
                        <!--三级-->
                        <ul class="kucun2-2">
                            <li class="cangku3"><i class="cangku3-1"></i><a href="#">仓库</a></li>
                            <li class="ruku3"><i class="ruku3-1"></i><a href="#">入库</a></li>
                            <li class="chuku3"><i class="chuku3-1"></i><a href="#">出库</a></li>
                          <li class="baobiao3-4"><i class="baobiao3-4-1"></i><a href="#">报表</a></li>
                        </ul>
                    </li>
                    <!--第七项,财务-->
                    <li class="caiwu2"><i class="caiwu2-1"></i><a href="#">财务</a>
                        <!--三级-->
                        <ul class="caiwu2-2">
                            <li class="caiwu3"><i class="caiwu3-1"></i><a href="#">财务管理</a></li>
                            <li class="yingshou3"><i class="yingshou3-1"></i><a href="#">应收</a></li>
                            <li class="yingfu3"><i class="yingfu3-1"></i><a href="#">应付</a></li>
                            <li class="tongji3"><i class="tongji3-1"></i><a href="#">统计</a>
                                <!--四级-->
                                <span class="one"></span>
                                <ul class="caiwu2-3">
                                    <li class="baobiao4"><a href="#">报表</a></li>
                                    <li class="liebiao4"><a href="#">列表</a></li>
                                    <li class="xinzeng4"><a href="#">新增</a></li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                </ul>
            </li>
        </ul>
    </p>
</body>

<!--<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>-->
<script src="JS/jquery-3.2.1.min.js"></script>
<script src="JS/shouye.js"></script>

</html>

CSS : **
*{

margin: 0;
padding: 0;

}
corps{

overflow-x: hidden;

}
/Arrière-plan de la barre de navigation/
.nav{

width: 1427px;
height: 80px;
background: url("../images/nav/zhuye.png") no-repeat  #204094;
position: relative;

}
/Bouton de la barre de navigation/
.box{

width: 690px;
height: 37px;
position: absolute;
top: 25px;
left: 299px;
/*border: 1px solid red;*/

}

.box un {

width: 41px;
height: 36px;
float: left;
display:  block;
margin-left: 25px;
/*border: 1px solid red;*/

}
/Gestion d'IE, compatible avec un cadre en pointillés de lien/
a:focus{outline:none;}

.a1{

background: url("../images/nav/ziliao.png") no-repeat;

}

.a2{

background: url("../images/nav/dingdan.png") no-repeat;

}

.a3{

 background: url("../images/nav/caigou.png") no-repeat;

}

.a4{

background: url("../images/nav/shengchan.png") no-repeat;

}

.a5{

background: url("../images/nav/kucun.png") no-repeat;

}

.a6{

background: url("../images/nav/caiwu.png") no-repeat;

}

/Barre latérale rétractable gauche, trois niveaux/
/Grande boîte de fond/
.leftNav{

width: 180px;
height: 846px;
background-color: #B3E0F8;
color: #0C318F;
font: 700 14px '微软雅黑';
/*border: 1px solid black;*/

}
/Le grand UL le plus à l'extérieur, la position globale de la première couche/
.ulBox1 {

margin-left: 15px;
padding-top: 25px;
cursor: pointer;

}
.ulBox1 li {

list-style: none;

}
.ulBox1 à {

text-decoration: none;
color: #0C318F;

}
/Cours public de deuxième niveau.Arrow/
.ulBox2 .yonghu2,.jichu2,.xiaoshou2,.caigou2,.shengchan2,.kucun2,.caiwu2 {

background: url("../images/qietu/leftnave/two/right2icon.png") no-repeat 0px 11px;
padding-left: 20px;
margin-left: -15px;

}
/Classe publique de troisième niveau.Arrow/
.ulBox2 .kehu3,.gongying3,.chanping3,.dingdan3,.baobiao3,.jihua3,.baobiao3-2,.shengcan3,.baobiao3-3,.cangku3 ,.ruku3,.chuku3,.baobiao3-4,
.caiwu3,.yingshou3,.yingfu3,.tongji3{

background: url("../images/qietu/leftnave/three/right3icon.png") no-repeat 0px 12px;
padding-left: 20px;
margin-left: -15px;

}
/Classe publique de style rapport/
.ulBox2 .baobiao3-1,.baobiao3-2-1,.baobiao3-3-1,.baobiao3-4-1 {

background: url("../images/qietu/leftnave/three/baobiao3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}

/Système de configuration des icônes de premier calque/
.ulBox1 .xitong{

background: url("../images/qietu/leftnave/one/xiyongicon.png") no-repeat 0px 2px ;
padding-left: 20px;

}

/Les distances supérieure et inférieure de toutes les options au deuxième niveau, toutes les options/
.ulBox2 li{

padding-top: 10px;

}

/La deuxième couche, le premier utilisateur d'icône de réglage /
.ulBox2 .yonghu1-1 {

background: url("../images/qietu/leftnave/two/yonghu2icon.png") no-repeat;
padding-left: 20px;

}

/Deuxième couche, deuxième icône de réglage de l'élément email/
.ulBox2 .jichu2-1 {

background: url("../images/qietu/leftnave/two/youjian2icon.png") no-repeat 0px 1.5px;
padding-left: 20px;

}
/Le deuxième niveau, la deuxième option, le répertoire de troisième niveau se déplace vers la gauche/
.ulBox2 .jichu2 ul{

margin-left: 12px;

}
/Deuxième niveau, deuxième option, paramètre d'icône de répertoire de troisième niveau/
/Premier élément/
.jichu2-2 .kehu3-1{

background: url("../images/qietu/leftnave/three/kehu3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Deuxième article/
.jichu2-2 .gongying3-1 {

background: url("../images/qietu/leftnave/three/gongying3icon.png") no-repeat 0px 1px;
padding-left: 20px;

}
/Le troisième élément/
.jichu2-2 .chanping3-1 {

background: url("../images/qietu/leftnave/three/chanping3icon.png") no-repeat 0px 3px;
padding-left: 20px;

}

/Le deuxième niveau, la troisième option, le répertoire de troisième niveau se déplace vers la gauche/
.ulBox2 .xiaoshou2 ul{

margin-left: 12px;

}
/La deuxième couche, la deuxième icône de réglage email/
.ulBox2 .xiaoshou2-1 {

background: url("../images/qietu/leftnave/two/xiaoshou2icon.png") no-repeat 0px 1.5px;
padding-left: 20px;

}
/Deuxième niveau, troisième option, paramètre d'icône de répertoire de troisième niveau/
/Premier élément/
.xiaoshou2-2 .dingdan3-1 {

background: url("../images/qietu/leftnave/three/dingdan3icon.png") no-repeat 0px 1px;
padding-left: 20px;

}

/Le deuxième niveau, la quatrième option, le répertoire du troisième niveau se déplacer vers la gauche/
.ulBox2 .caigou2 ul {

margin-left: 12px;

}
/Deuxième niveau, quatrième icône d'achat de paramètre d'article/
.ulBox2 .caigou2-1 {

background: url("../images/qietu/leftnave/two/caigou2icon.png") no-repeat 0px 1.5px;
padding-left: 20px;

}
/Deuxième niveau, quatrième option, icône de configuration du répertoire de troisième niveau/
/Premier élément/
.caigou2-2 .jihua3-1 {

background: url("../images/qietu/leftnave/three/jihua3(caigou)icon.png") no-repeat 0px 2px;
padding-left: 20px;

}

/Le deuxième niveau, la cinquième option, le répertoire du troisième niveau se déplace vers la gauche/
.ulBox2 .shengchan2 ul {

margin-left: 12px;

}
/Deuxième couche, cinquième icône de production de paramètres d'élément/
.ulBox2 .shengchan2-1 {

background: url("../images/qietu/leftnave/two/shengchan2icon.png") no-repeat;
padding-left: 20px;

}
/Deuxième niveau, cinquième option, icône de configuration du répertoire de troisième niveau/
/Premier élément/
.shengchan2-2 .shengchan3-1 {

background: url("../images/qietu/leftnave/three/shengchan3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}

/Le deuxième niveau, la sixième option, le répertoire du troisième niveau se déplace vers la gauche/
.ulBox2 .kucun2 ul {

margin-left: 12px;

}
/Deuxième couche, sixième icône d'inventaire de paramètres d'objet/
.ulBox2 .kucun2-1 {

background: url("../images/qietu/leftnave/two/kucun2icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Deuxième niveau, sixième option, icône de configuration du répertoire de troisième niveau/
/Premier élément/
.kucun2-2 .cangku3-1 {

background: url("../images/qietu/leftnave/three/cangku3icon.png") no-repeat 0px 1px;
padding-left: 20px;

}
/Deuxième article/
.kucun2-2 .ruku3-1 {

background: url("../images/qietu/leftnave/three/ruku3icon.png") no-repeat 0px 1px;
padding-left: 20px;

}
/Le troisième article/
.kucun2-2 .chuku3-1 {

background: url("../images/qietu/leftnave/three/chuku3icon.png") no-repeat 0px 1px;
padding-left: 20px;

}

/Le deuxième niveau, la septième option, le répertoire du troisième niveau se déplace vers la gauche/
.ulBox2 .caiwu2 ul {

margin-left: 12px;

}
/Deuxième niveau, septième icône d'inventaire de paramètres d'objet/
.ulBox2 .caiwu2-1 {

background: url("../images/qietu/leftnave/two/caiwu2icon.png") no-repeat 0px 1px;
padding-left: 20px;

}
/Deuxième niveau, septième option, icône de configuration du répertoire de troisième niveau/
/Premier élément/
.caiwu2-2 .caiwu3-1 {

background: url("../images/qietu/leftnave/three/caiwuguanli3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Deuxième article/
.caiwu2-2 .yingshou3-1 {

background: url("../images/qietu/leftnave/three/yingshou3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Le troisième article/
.caiwu2-2 .yingfu3-1 {

background: url("../images/qietu/leftnave/three/yingfu3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Le quatrième article/
.caiwu2-2 .tongji3-1 {

background: url("../images/qietu/leftnave/three/tongji3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Deuxième niveau, septième option, icône de configuration du répertoire de quatrième niveau/
.caiwu2-3{

margin-left: -15px;

}
/Le premier article/
.caiwu2-3 .baobiao4 {

background: url("../images/qietu/leftnave/four/baobiao4icon.png") no-repeat 0px 11px;
padding-left: 20px;

}
/Deuxième article/
.caiwu2-3 .liebiao4 {

background: url("../images/qietu/leftnave/four/liebiao4icon.png") no-repeat 0px 12px;
padding-left: 20px;

}
/Le troisième élément/
.caiwu2-3 .xinzeng4 {

background: url("../images/qietu/leftnave/four/xinzeng4icon.png") no-repeat 0px 12px;
padding-left: 20px;

}
/La deuxième couche, le deuxième niveau ul ulBox2, 7 options li .jichu2/.xiaoshou2/.caigou2/.shengchan2/.kucun2/.caiwu2 Le troisième niveau correspondant au deuxième niveau 6 plis /
/ .jichu2-2 .xiaoshou2-2 .caigou2-2 .shengchan2-2 .kucun2-2 .caiwu2-2/
.ulBox2 .jichu2-2,.xiaoshou2-2,.caigou2-2,.shengchan2-2,. kucun2-2,.caiwu2-2 {

display: none;

}

/La troisième couche .tongji3 un pli, .caiwu2-3/
.ulBox2 .caiwu2-3 {

display: none;

}
.hideen {

display: block;

}
/!!Afficher !!/
.show {
affichage : bloquer;
}

//Code CSSS :
*{ 

margin: 0;
padding: 0;

}
corps{

overflow-x: hidden;

}
/Arrière-plan de la barre de navigation/
.nav{

width: 1427px;
height: 80px;
background: url("../images/nav/zhuye.png") no-repeat  #204094;
position: relative;

}
/Bouton de la barre de navigation/
.box{

width: 690px;
height: 37px;
position: absolute;
top: 25px;
left: 299px;
/*border: 1px solid red;*/

}

.box un {

width: 41px;
height: 36px;
float: left;
display:  block;
margin-left: 25px;
/*border: 1px solid red;*/

}
/Gestion d'IE, compatible avec un cadre en pointillés de lien/
a:focus{outline:none;}

.a1{

background: url("../images/nav/ziliao.png") no-repeat;

}

.a2{

background: url("../images/nav/dingdan.png") no-repeat;

}

.a3{

 background: url("../images/nav/caigou.png") no-repeat;

}

.a4{

background: url("../images/nav/shengchan.png") no-repeat;

}

.a5{

background: url("../images/nav/kucun.png") no-repeat;

}

.a6{

background: url("../images/nav/caiwu.png") no-repeat;

}

/Barre latérale rétractable gauche, trois niveaux/
/Grande boîte de fond/
.leftNav{

width: 180px;
height: 846px;
background-color: #B3E0F8;
color: #0C318F;
font: 700 14px '微软雅黑';
/*border: 1px solid black;*/

}
/Le grand UL le plus à l'extérieur, la position globale de la première couche/
.ulBox1 {

margin-left: 15px;
padding-top: 25px;
cursor: pointer;

}
.ulBox1 li {

list-style: none;

}
.ulBox1 à {

text-decoration: none;
color: #0C318F;

}
/Cours public de deuxième niveau.Arrow/
.ulBox2 .yonghu2,.jichu2,.xiaoshou2,.caigou2,.shengchan2,.kucun2,.caiwu2 {

background: url("../images/qietu/leftnave/two/right2icon.png") no-repeat 0px 11px;
padding-left: 20px;
margin-left: -15px;

}
/Classe publique de troisième couche.Arrow/
.ulBox2 .kehu3,.gongying3,.chanping3,.dingdan3,.baobiao3,.jihua3,.baobiao3-2,.shengcan3,.baobiao3-3,.cangku3, .ruku3,.chuku3,.baobiao3-4,
.caiwu3,.yingshou3,.yingfu3,.tongji3{

background: url("../images/qietu/leftnave/three/right3icon.png") no-repeat 0px 12px;
padding-left: 20px;
margin-left: -15px;

}
/Classe publique de style rapport/
.ulBox2 .baobiao3-1,.baobiao3-2-1,.baobiao3-3-1,.baobiao3-4-1 {

background: url("../images/qietu/leftnave/three/baobiao3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}

/Système de configuration des icônes de premier calque/
.ulBox1 .xitong{

background: url("../images/qietu/leftnave/one/xiyongicon.png") no-repeat 0px 2px ;
padding-left: 20px;

}

/Les distances supérieure et inférieure de toutes les options au deuxième niveau, toutes les options/
.ulBox2 li{

padding-top: 10px;

}

/La deuxième couche, le premier utilisateur d'icône de réglage /
.ulBox2 .yonghu1-1 {

background: url("../images/qietu/leftnave/two/yonghu2icon.png") no-repeat;
padding-left: 20px;

}

/Deuxième couche, deuxième icône de réglage de l'élément email/
.ulBox2 .jichu2-1 {

background: url("../images/qietu/leftnave/two/youjian2icon.png") no-repeat 0px 1.5px;
padding-left: 20px;

}
/Le deuxième niveau, la deuxième option, le répertoire de troisième niveau se déplace vers la gauche/
.ulBox2 .jichu2 ul{

margin-left: 12px;

}
/Deuxième niveau, deuxième option, paramètre d'icône de répertoire de troisième niveau/
/Premier élément/
.jichu2-2 .kehu3-1{

background: url("../images/qietu/leftnave/three/kehu3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Deuxième article/
.jichu2-2 .gongying3-1 {

background: url("../images/qietu/leftnave/three/gongying3icon.png") no-repeat 0px 1px;
padding-left: 20px;

}
/Le troisième article/
.jichu2-2 .chanping3-1 {

background: url("../images/qietu/leftnave/three/chanping3icon.png") no-repeat 0px 3px;
padding-left: 20px;

}

/Le deuxième niveau, la troisième option, le répertoire de troisième niveau se déplace vers la gauche/
.ulBox2 .xiaoshou2 ul{

margin-left: 12px;

}
/La deuxième couche, la deuxième icône de réglage email/
.ulBox2 .xiaoshou2-1 {

background: url("../images/qietu/leftnave/two/xiaoshou2icon.png") no-repeat 0px 1.5px;
padding-left: 20px;

}
/Deuxième niveau, troisième option, paramètre d'icône de répertoire de troisième niveau/
/Premier élément/
.xiaoshou2-2 .dingdan3-1 {

background: url("../images/qietu/leftnave/three/dingdan3icon.png") no-repeat 0px 1px;
padding-left: 20px;

}

/Le deuxième niveau, la quatrième option, le répertoire du troisième niveau se déplacer vers la gauche/
.ulBox2 .caigou2 ul {

margin-left: 12px;

}
/Deuxième couche, quatrième icône d'achat de paramètre d'article/
.ulBox2 .caigou2-1 {

background: url("../images/qietu/leftnave/two/caigou2icon.png") no-repeat 0px 1.5px;
padding-left: 20px;

}
/Deuxième niveau, quatrième option, icône de configuration du répertoire de troisième niveau/
/Premier élément/
.caigou2-2 .jihua3-1 {

background: url("../images/qietu/leftnave/three/jihua3(caigou)icon.png") no-repeat 0px 2px;
padding-left: 20px;

}

/Le deuxième niveau, la cinquième option, le répertoire du troisième niveau se déplace vers la gauche/
.ulBox2 .shengchan2 ul {

margin-left: 12px;

}
/Deuxième couche, cinquième icône de production de paramètres d'élément/
.ulBox2 .shengchan2-1 {

background: url("../images/qietu/leftnave/two/shengchan2icon.png") no-repeat;
padding-left: 20px;

}
/Deuxième niveau, cinquième option, icône de configuration du répertoire de troisième niveau/
/Premier élément/
.shengchan2-2 .shengchan3-1 {

background: url("../images/qietu/leftnave/three/shengchan3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}

/Le deuxième niveau, la sixième option, le répertoire du troisième niveau se déplace vers la gauche/
.ulBox2 .kucun2 ul {

margin-left: 12px;

}
/Deuxième couche, sixième icône d'inventaire de paramètres d'objet/
.ulBox2 .kucun2-1 {

background: url("../images/qietu/leftnave/two/kucun2icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Deuxième niveau, sixième option, icône de configuration du répertoire de troisième niveau/
/Premier élément/
.kucun2-2 .cangku3-1 {

background: url("../images/qietu/leftnave/three/cangku3icon.png") no-repeat 0px 1px;
padding-left: 20px;

}
/Deuxième article/
.kucun2-2 .ruku3-1 {

background: url("../images/qietu/leftnave/three/ruku3icon.png") no-repeat 0px 1px;
padding-left: 20px;

}
/Le troisième article/
.kucun2-2 .chuku3-1 {

background: url("../images/qietu/leftnave/three/chuku3icon.png") no-repeat 0px 1px;
padding-left: 20px;

}

/Le deuxième niveau, la septième option, le répertoire du troisième niveau se déplace vers la gauche/
.ulBox2 .caiwu2 ul {

margin-left: 12px;

}
/Deuxième niveau, septième icône d'inventaire de paramètres d'objet/
.ulBox2 .caiwu2-1 {

background: url("../images/qietu/leftnave/two/caiwu2icon.png") no-repeat 0px 1px;
padding-left: 20px;

}
/Deuxième niveau, septième option, icône de configuration du répertoire de troisième niveau/
/Premier élément/
.caiwu2-2 .caiwu3-1 {

background: url("../images/qietu/leftnave/three/caiwuguanli3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Deuxième article/
.caiwu2-2 .yingshou3-1 {

background: url("../images/qietu/leftnave/three/yingshou3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Le troisième article/
.caiwu2-2 .yingfu3-1 {

background: url("../images/qietu/leftnave/three/yingfu3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Le quatrième article/
.caiwu2-2 .tongji3-1 {

background: url("../images/qietu/leftnave/three/tongji3icon.png") no-repeat 0px 2px;
padding-left: 20px;

}
/Deuxième niveau, septième option, icône de configuration du répertoire de quatrième niveau/
.caiwu2-3{

margin-left: -15px;

}
/Le premier article/
.caiwu2-3 .baobiao4 {

background: url("../images/qietu/leftnave/four/baobiao4icon.png") no-repeat 0px 11px;
padding-left: 20px;

}
/Deuxième article/
.caiwu2-3 .liebiao4 {

background: url("../images/qietu/leftnave/four/liebiao4icon.png") no-repeat 0px 12px;
padding-left: 20px;

}
/Le troisième élément/
.caiwu2-3 .xinzeng4 {

background: url("../images/qietu/leftnave/four/xinzeng4icon.png") no-repeat 0px 12px;
padding-left: 20px;

}
/La deuxième couche, le deuxième niveau ul ulBox2, 7 options li .jichu2/.xiaoshou2/.caigou2/.shengchan2/.kucun2/.caiwu2 Le troisième niveau correspondant au deuxième niveau 6 plis /
/ .jichu2-2 .xiaoshou2-2 .caigou2-2 .shengchan2-2 .kucun2-2 .caiwu2-2/
.ulBox2 .jichu2-2,.xiaoshou2-2,.caigou2-2,.shengchan2-2,. kucun2-2,.caiwu2-2 {

display: none;

}

/La troisième couche .tongji3 un pli, .caiwu2-3/
.ulBox2 .caiwu2-3 {

display: none;

}
.hideen {

display: block;

}
/!!Afficher !!/
.show {
affichage : bloquer;
}

// Code JS, en utilisant JQ*
/**

  • Créé par zhengyongchun le 18/04/2017.
    */

//Partie de la barre de navigation d'en-tête :
$(function () {

$(".a1").mousedown(function () {
    $(".a1").css({'background': 'url(images/nav/ziliaonex.png) no-repeat'});
})
$(".a1").mouseup(function () {
    $(".a1").css({'background': 'url(images/nav/ziliao.png) no-repeat'});
})
$(".a2").mousedown(function () {
    $(".a2").css({'background': 'url(images/nav/dingdannex.png) no-repeat'});
})
$(".a2").mouseup(function () {
    $(".a2").css({'background': 'url(images/nav/dingdan.png) no-repeat'});
})
$(".a3").mousedown(function () {
    $(".a3").css({'background': 'url(images/nav/caigounex.png) no-repeat'});
})
$(".a3").mouseup(function () {
    $(".a3").css({'background': 'url(images/nav/caigou.png) no-repeat'});
})
$(".a4").mousedown(function () {
    $(".a4").css({'background': 'url(images/nav/shengchannex.png) no-repeat'});
})
$(".a4").mouseup(function () {
    $(".a4").css({'background': 'url(images/nav/shengchan.png) no-repeat'});
})
$(".a5").mousedown(function () {
    $(".a5").css({'background': 'url(images/nav/kucunnex.png) no-repeat'});
})
$(".a5").mouseup(function () {
    $(".a5").css({'background': 'url(images/nav/kucun.png) no-repeat'});
})
$(".a6").mousedown(function () {
    $(".a6").css({'background': 'url(images/nav/caiwunex.png) no-repeat'});
})
$(".a6").mouseup(function () {
    $(".a6").css({'background': 'url(images/nav/caiwu.png) no-repeat'});
})

// 左三级侧边栏
// 二级所有点击li选项集合
// console.log($(".ulBox2>li:not(.yonghu2)"));
// 二级li选项中的所有收放UL集合
// console.log($(".ulBox2>li:not(.yonghu2)>ul"));
// 三级 .tongji3
var count=0;
$(".ulBox2>li:not(.yonghu2,caiwu2)").click(function () {
    if(count==0){
        $(this).children("ul").css('display','block');
        count=1;
    }else if(count==1){
        $(this).children("ul").css('display','none');
        count=0;
    }
})
var count1=0;
$(".caiwu2-2>.tongji3").click(function (e) {
    e.stopPropagation();
    if(count1==0){
        $(this).children("ul").css('display','block');
        count1=1;
    }else if(count1==1){
        $(this).children("ul").css('display','none');
        count1=0;
    }
})

// var count=0;
// $(".ulBox2>li:not(.yonghu2,caiwu2)").click(function () {
//     if (count==0){
//         $(this).children("ul").css('display','block');
//         count=1;
//     }else if(count==1){
//         $(this).children("ul").css('display','none');
//         count=0;
//     }
// }

})

为情所困
为情所困

répondre à tous(2)
为情所困
为情所困2017-05-19 10:37:10 2 plancher

Soutien amical. . .
Donnez-vous une suggestion :
1. Il ne doit pas y avoir de fautes de frappe dans le titre de la question et les phrases doivent être fluides. Vérifiez-le vous-même avant de publier
2. être trop long, trois à quatre cents lignes de code pas le temps de lire ici

.
Comme +0
Ajouter une réponse
阿神
阿神2017-05-19 10:37:10 1 plancher

Ne serait-il pas préférable de publier le code clé ?

Comme +0
Ajouter une réponse
Sujets populaires
Plus>
Articles populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal