<th id="jonck"><track id="jonck"></track></th>
<progress id="jonck"></progress>
    1. <progress id="jonck"></progress>

    2. <button id="jonck"><acronym id="jonck"></acronym></button>

    3. 小程序APP網(wǎng)站定制開(kāi)發(fā)專(zhuān)家

      [科技]基于jquery網(wǎng)站左側下拉菜單

        網(wǎng)站左側下拉菜單jQuery代碼。這是一款藍色風(fēng)格的適合做后臺下拉菜單代碼。效果圖如下:

        實(shí)現的代碼:

      <div class="container">
      
      	<div class="leftsidebar_box">
      		<div class="line"></div>
      		<dl class="system_log">
      			<dt onClick="changeImage()">系統記錄<img src="images/left/select_xl01.png"></dt>
      			<dd class="first_dd"><a href="#">充值記錄</a></dd>
      			<dd><a href="#">短信充值記錄</a></dd>
      			<dd><a href="#">消費記錄</a></dd>
      			<dd><a href="#">操作記錄</a></dd>
      		</dl>
      	
      		<dl class="custom">
      			<dt onClick="changeImage()">客戶(hù)管理<img src="images/left/select_xl01.png"></dt>
      			<dd class="first_dd"><a href="#">客戶(hù)管理</a></dd>
      			<dd><a href="#">試用/成交客戶(hù)管理</a></dd>
      			<dd><a href="#">未成交客戶(hù)管理</a></dd>
      			<dd><a href="#">即將到期客戶(hù)管理</a></dd>
      		</dl>
      	
      		<dl class="channel">
      			<dt>渠道管理<img src="images/left/select_xl01.png"></dt>
      			<dd class="first_dd"><a href="#">渠道主頁(yè)</a></dd>
      			<dd><a href="#">渠道標準管理</a></dd>
      			<dd><a href="#">系統通知</a></dd>
      			<dd><a href="#">渠道商管理</a></dd>
      			<dd><a href="#">渠道商鏈接</a></dd>
      		</dl>
      	
      		<dl class="app">
      			<dt onClick="changeImage()">APP管理<img src="images/left/select_xl01.png"></dt>
      			<dd class="first_dd"><a href="#">App運營(yíng)商管理</a></dd>
      			<dd><a href="#">開(kāi)放接口管理</a></dd>
      			<dd><a href="#">接口類(lèi)型管理</a></dd>
      		</dl>
      	
      		<dl class="cloud">
      			<dt>大數據云平臺<img src="images/left/select_xl01.png"></dt>
      			<dd class="first_dd"><a href="#">平臺運營(yíng)商管理</a></dd>
      		</dl>
      	
      		<dl class="syetem_management">
      			<dt>系統管理<img src="images/left/select_xl01.png"></dt>
      			<dd class="first_dd"><a href="#">后臺用戶(hù)管理</a></dd>
      			<dd><a href="#">角色管理</a></dd>
      			<dd><a href="#">客戶(hù)類(lèi)型管理</a></dd>
      			<dd><a href="#">欄目管理</a></dd>
      			<dd><a href="#">微官網(wǎng)模板組管理</a></dd>
      			<dd><a href="#">商城模板管理</a></dd>
      			<dd><a href="#">微功能管理</a></dd>
      			<dd><a href="#">修改用戶(hù)密碼</a></dd>
      		</dl>
      	
      		<dl class="source">
      			<dt>素材庫管理<img src="images/left/select_xl01.png"></dt>
      			<dd class="first_dd"><a href="#">圖片庫</a></dd>
      			<dd><a href="#">鏈接庫</a></dd>
      			<dd><a href="#">推廣管理</a></dd>
      		</dl>
      	
      		<dl class="statistics">
      			<dt>統計分析<img src="images/left/select_xl01.png"></dt>
      			<dd class="first_dd"><a href="#">客戶(hù)統計</a></dd>
      		</dl>
      	
      	</div>
      
      </div>

        css代碼:

      body{margin:0;padding:0;overflow-x:hidden;}
      html, body{height:100%;}
      img{border:none;}
      *{font-family:'微軟雅黑';font-size:12px;color:#626262;}
      dl,dt,dd{display:block;margin:0;}
      a{text-decoration:none;}
      
      #bg{background-image:url(images/content/dotted.png);}
      .container{width:100%;height:100%;margin:auto;}
      
      /*left*/
      .leftsidebar_box{width:160px;height:auto !important;overflow:visible !important;position:fixed;height:100% !important;background-color:#3992d0;}
      .line{height:2px;width:100%;background-image:url(images/left/line_bg.png);background-repeat:repeat-x;}
      .leftsidebar_box dt{padding-left:40px;padding-right:10px;background-repeat:no-repeat;background-position:10px center;color:#f5f5f5;font-size:14px;position:relative;line-height:48px;cursor:pointer;}
      .leftsidebar_box dd{background-color:#317eb4;padding-left:40px;}
      .leftsidebar_box dd a{color:#f5f5f5;line-height:20px;}
      .leftsidebar_box dt img{position:absolute;right:10px;top:20px;}
      .system_log dt{background-image:url(images/left/system.png)}
      .custom dt{background-image:url(images/left/custom.png)}
      .channel dt{background-image:url(images/left/channel.png)}
      .app dt{background-image:url(images/left/app.png)}
      .cloud dt{background-image:url(images/left/cloud.png)}
      .syetem_management dt{background-image:url(images/left/syetem_management.png)}
      .source dt{background-image:url(images/left/source.png)}
      .statistics dt{background-image:url(images/left/statistics.png)}
      .leftsidebar_box dl dd:last-child{padding-bottom:10px;}

      上一篇: [科技]手機觸屏滑動(dòng)圖片切換插件swiper.js

      下一篇: 【php筆記】php整型就是整數

      在線(xiàn)客服
      在線(xiàn)客服關(guān)閉
      品智官方微信

      掃碼關(guān)注官方微信

      影音先锋在线资源资源网_日韩亚洲国产综合ΑV高清_成年女人免费视频播放大全_久久精品国产久精国产爱