亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

小米商城的導(dǎo)航

Original 2019-02-09 22:03:47 368
abstract:<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">&

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>小米商城</title>

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

<link rel="stylesheet" href="xiaomi/css/style01.css">

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


</head>

<body>

<header>

<div class="hc mc">

<div class="hc_l l" style="width:700px;">

<a href="" style="padding-left:0px;">小米商城</a>

<a href="">MIUI</a>

<a href="">loT</a>

<a href="">云服務(wù)</a>

<a href="">金融</a>

<a href="">有品</a>

<a href="">小愛開放平臺</a>

<a href="">政企服務(wù)</a>

<a href="">資質(zhì)證照</a>

<a href="">協(xié)議規(guī)則</a>

<a href="">下載app</a>

<a href="" style="border-right:none;">Select Region</a>

</div>

<div class="hc_r r" style="width:280px;">

<a href="xiaomilogin/html">登錄</a>

<a href="">注冊</a>

<a href="">消息通知</a>                

<a href="" style="width:100px;border-right:none;background:#424242;"><span class="layui-icon layui-icon-cart"></span>購物車(0)</a>

</div>

<div class="clear"></div>

</div>

</header>


<main>      

<div class="mcontentup mc">

<div class="mcheader" style="margin-top:24px;">

<div class="mch_l l"><a href="#"><img src="xiaomi/images/logo.png"></a></div>

<div class="mch_m">

<a name="imga" onmouseover="fa(this)" onmouseleave="fa1(this)" href="">小米手機</a>

<div class="mch_img" name="imgi">

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/t0mix3.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/t01qingchun.png"></a>

<p><a href="">小米8 青春版</a></p>

<p class="jg">1399元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/t02mi8.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/t03miplay.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/t04mi8se.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

</div>        

<a name="imga" onmouseover="fa(this)" onmouseleave="fa1(this)" href="">紅米</a>

<div class="mch_img" name="imgi">

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/hm1.png"></a>

<p><a href="">紅米Note 7</a></p>

<p class="jg">999元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm2.png"></a>

<p><a href="">小米8 青春版</a></p>

<p class="jg">1399元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm3.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/hm4.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm5.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

</div>

<a name="imga" onmouseover="fa(this)" onmouseleave="fa1(this)" href="">電視</a>

<div class="mch_img" name="imgi">

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/hm1.png"></a>

<p><a href="">小米電視4S 75英寸</a></p>

<p class="jg">7999元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm2.png"></a>

<p><a href="">小米8 青春版</a></p>

<p class="jg">1399元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm3.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<p class="xp">新品</p>

<a href=""><img src="xiaomi/images/hm4.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

<span></span>

<div class="mch_imgbox">

<a href=""><img src="xiaomi/images/hm5.png"></a>

<p><a href="">小米MIX 3</a></p>

<p class="jg">3299元起</p>

</div>

</div>

<a name="imga" href="">筆記本</a>

<a name="imga" href="">家電</a>

<a name="imga" href="">新品</a>

<a name="imga" href="">路由器</a>

<a name="imga" href="">智能硬件</a>

<a name="imga" href="">服務(wù)</a>

<a name="imga" href="">社區(qū)</a>

</div>

<div class="mch_r r" style="width:292px;height:50px;border:1px solid #e0e0e0;">

<input type="text" placeholder="小米8 小米MIX 2S" style="width:242px;height:50px;border:1px solid #e0e0e0;">&nbsp;&nbsp;

<span class="layui-icon layui-icon-search" style="font-size:18px;font-weight:bold;"></span>

</div>                

</div>

<div class="clear"></div>

<div style="margin-top:24px;">

<div class="mcnav_l l">

<a onmouseover="fa(this)" onmouseleave="fa1(this)" href="">手機 電話卡 <span class="layui-icon layui-icon-right"></span></a>

<div class="mcnav_box" >

<div class="mcnav_imgbox">

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

</div>  

<div class="mcnav_imgbox">

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

</div>                                  

</div>

<a onmouseover="fa(this)" onmouseleave="fa1(this)" href="">電視 盒子 <span class="layui-icon layui-icon-right"></span></a>

<div class="mcnav_box" >

<div class="mcnav_imgbox">

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

</div>  

<div class="mcnav_imgbox">

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

<a href=""><img src="xiaomi/images/sj01.png">小米MIX 3</a>

<a href=""><img src="xiaomi/images/sj02.png">小米8 青春版</a>

</div>                                  

</div>

<a href="">筆記本 平板 <span class="layui-icon layui-icon-right"></span></a>

<a href="">家電 插線板 <span class="layui-icon layui-icon-right"></span></a>

<a href="">出行 穿戴 <span class="layui-icon layui-icon-right"></span></a>

<a href="">智能 路由器 <span class="layui-icon layui-icon-right"></span></a>

<a href="">電源 配件 <span class="layui-icon layui-icon-right"></span></a>

<a href="">健康 兒童 <span class="layui-icon layui-icon-right"></span></a>

<a href="">耳機 音箱 <span class="layui-icon layui-icon-right"></span></a>

<a href="">生活 箱包 <span class="layui-icon layui-icon-right"></span></a>

</div>

<div class="mcnav_r r" id="slideShowContainer">

<ul id="picUl">

<li><a href="#"><img src="xiaomi/images/xmad_11.jpg" alt=""/></a></li>

<li><a href="#"><img src="xiaomi/images/xmad_12.jpg" alt=""/></a></li>

<li><a href="#"><img src="xiaomi/images/xmad_13.jpg" alt=""/></a></li>

<li><a href="#"><img src="xiaomi/images/xmad_14.jpg" alt=""/></a></li>

</ul>

<ul id="dotUl">

<li class="selected">1</li>

<li class="unselected">2</li>

<li class="unselected">3</li>

<li class="unselected">4</li>

</ul>

</div>

</div>

<div class="clear"></div>

<div style="margin-top:15px;">

<div class="mcnav-zx">

<div style="border-bottom: 1px solid gray;">

<a href=""><i class="layui-icon layui-icon-cellphone"></i>選購手機</a>

<a href=""><i class="layui-icon layui-icon-cellphone"></i>企業(yè)團購</a>

<a href="" style="border:none;"><i class="layui-icon layui-icon-cellphone"></i>F碼通道</a>

</div>

<div>

<a href=""><i class="layui-icon layui-icon-cellphone"></i>米粉卡</a>

<a href=""><i class="layui-icon layui-icon-cellphone"></i>以舊換新</a>

<a href="" style="border:none;"><i class="layui-icon layui-icon-cellphone"></i>話費充值</a>

</div>

</div>

<a href="" style="margin-left:9px;"><img src="xiaomi/images/xmad_111.jpg" class="img32"></a>

<a href="" style="margin-left:8px;"><img src="xiaomi/images/xmad_112.jpg" class="img32"></a>

<a href="" style="margin-left:8px;"><img src="xiaomi/images/xmad_113.jpg" class="img32"></a>

</div>

<div class="clear"></div>

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">小米閃購</h2>

<p style="width:75px;float:right;"><i class="layui-icon layui-icon-left"></i><i class="layui-icon layui-icon-right"></i></p>

</div>

<div class="img40" style="background-color:#F1EDED;border-top:1px solid red;">

<br>

<p style="font-size:20px;color:red;text-align: center;margin:30px 0;">10:00 場</p>

<p style="text-align: center;"><img src="xiaomi/images/xmsg.png"></p>

<p style="font-size:14px;color:gray;text-align: center;margin:30px 0;">距離結(jié)束還有</p>

<p style="width:200px;padding:0px 15px;"><span class="sfm">00</span><span class="sfm">00</span><span class="sfm">00</span></p>

</div>

<div class="img40" style="border-top:1px solid #ff6700;margin-left:13px;">

<a href=""><img class="img41" src="xiaomi/images/xmsg1.jpg"></a>

</div>

<div class="img40" style="border-top:1px solid green;margin-left:13px;">

<a href=""><img class="img41" src="xiaomi/images/xmsg2.jpg"></a>

</div>

<div class="img40" style="border-top:1px solid blue;margin-left:13px;">

<a href=""><img class="img41" src="xiaomi/images/xmsg3.jpg"></a>

</div>

<div class="img40" style="border-top:1px solid red;margin-left:13px;">

<a href=""><img class="img41" src="xiaomi/images/xmsg4.jpg"></a>

</div>              

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/01sj.jpg" class="img1"></a></div>

</div>

</div>


<div class="clear"></div>          

<div style="width:100%;background-color:#f5f5f5; margin-top:35px;">

<div class="mcontentdown mc">  

<div>

<div class="xbt">

<h2 style="float:left;">手機</h2>

<p style="width:80px;float:right;"><span id="span1">查看全部</span><i id="icon1" class="layui-icon layui-icon-right"></i></p>

</div>

<a href=""><img class="img51" src="xiaomi/images/sj0.jpg"></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/02dsj.jpg" class="img1"></a></div>

<div class="clear"></div>          

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">家電</h2>

<p style="width:auto;float:right;">

<span class="span2">熱門</span>

<span class="span2">電視影音</span>

<span class="span2">電腦</span>

<span class="span2">家居</span></p>

</div>

<a href=""><img class="img52" src="xiaomi/images/jd0.jpg"></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src="xiaomi/images/jd01.jpg"></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img60" src=""></a>

<a href=""><img class="img60" src=""></a>    

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/03yx.jpg" class="img1"></a></div>

<div class="clear"></div>          

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">智能</h2>

<p style="width:auto;float:right;">

<span class="span2">熱門</span>

<span class="span2">出行</span>

<span class="span2">健康</span>

<span class="span2">酷玩</span>

<span class="span2">路由器</span>

</p>

</div>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img60" src=""></a>

<a href=""><img class="img60" src=""></a>  

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/04b.jpg" class="img1"></a> </div>

<div class="clear"></div>          

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">搭配</h2>

<p style="width:auto;float:right;">

<span class="span2">熱門</span>

<span class="span2">耳機</span>

<span class="span2">音箱</span>

<span class="span2">電源</span>

<span class="span2">電池存儲卡</span>

</p>

</div>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img60" src=""></a>

<a href=""><img class="img60" src=""></a>  

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/05dlq.jpg" class="img1"></a> </div>

<div class="clear"></div>          

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">配件</h2>

<p style="width:auto;float:right;">

<span class="span2">熱門</span>

<span class="span2">保護套</span>

<span class="span2">貼膜</span>

<span class="span2">其它配件</span>

</p>

</div>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img60" src=""></a>

<a href=""><img class="img60" src=""></a>  

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/06lyej.jpg" class="img1"></a> </div>

<div class="clear"></div>          

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">周邊</h2>

<p style="width:auto;float:right;">

<span class="span2">熱門</span>

<span class="span2">出行</span>

<span class="span2">居家</span>

<span class="span2">生活周邊</span>

<span class="span2">箱包</span>

</p>

</div>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img60" src=""></a>

<a href=""><img class="img60" src=""></a>  

</div>

<div class="clear"></div>

<div style="margin-top:35px;"><a href=""><img src="xiaomi/images/07ms.jpg" class="img1"></a> </div>

<div class="clear"></div>

<div style="margin-top:35px;">

<div class="xbt">

<h2 style="float:left;">為你推薦</h2>

<p style="width:75px;float:right;"><i class="layui-icon layui-icon-left"></i><i class="layui-icon layui-icon-right"></i></p>

</div>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

<a href=""><img class="img52" src=""></a>

</div>

<div class="clear"></div>

<div>

<p>熱評產(chǎn)品</p>

<a href=""><img class="img70" src=""></a>

<a href=""><img class="img70" src=""></a>

<a href=""><img class="img70" src=""></a>

<a href=""><img class="img70" src=""></a>

<a href=""><img class="img71" src=""></a>

<a href=""><img class="img71" src=""></a>

<a href=""><img class="img71" src=""></a>

<a href=""><img class="img71" src=""></a>

</div>

<div class="clear"></div>

<div>

<p>內(nèi)容</p>

<a href=""><img class="img80" src=""></a>

<a href=""><img class="img80" src=""></a>

<a href=""><img class="img80" src=""></a>

<a href=""><img class="img80" src=""></a>

</div>

<div class="clear"></div>

<div>

<p>視頻</p>

<a href=""><img class="img90" src=""></a>

<a href=""><img class="img90" src=""></a>

<a href=""><img class="img90" src=""></a>

<a href=""><img class="img90" src=""></a>

</div>

<div class="clear"></div>

</div>

</main>

<footer>

<div class="fcontent" style="background-color:#fff;">

<div class="ftnav mc">

<a href=""><span class=""></span>預(yù)約維修服務(wù)</a>

<a href=""><span class=""></span>7天無理由退貨</a>

<a href=""><span class=""></span>15天免費換貨</a>

<a href=""><span class=""></span>滿150元包郵</a>

<a href="" style="border-right:none;"><span class=""></span>520余家售后網(wǎng)點</a>

</div>

<div class="ftc mc">

<div class="ftc_l l">

<div><p>幫助中心</p> <p>服務(wù)支持</p><p>線下門店</p><p>關(guān)于小米</p><p>關(guān)注我們</p><p>特色服務(wù)</p></div>                    

<div>

<a href="">賬戶管理</a>

<a href="">售后政策</a>

<a href="">小米之家</a>

<a href="">了解小米</a>

<a href="">新浪微博</a>

<a href="">F碼通道</a>

<a href="">購物指南</a>

<a href="">自助服務(wù)</a>

<a href="">服務(wù)網(wǎng)點</a>

<a href="">加入小米</a>

<a href="">官方微信</a>

<a href="">禮物碼</a>

<a href="">訂單操作</a>

<a href="">相關(guān)下載</a>

<a href="">授權(quán)體驗店</a>

<a href="">投資者</a>

<a href="">聯(lián)系我們</a>

<a href="">防偽查詢</a>

</div>

</div>                    

<div class="ftc_r r">

<p style="font-size:20px;color:#ff5700;margin-bottom: 5px;">400-100-5678</p>

<p style="font-size:8px;margin-bottom: 5px;">周一至周日8:00-18:00</p>

<p style="font-size:8px;margin-bottom: 5px;">(僅收市話費)</p><br>

<button class="btfoot">聯(lián)系客服</button>

</div>                

</div>        

</div>

<div class="ftft mc" style="padding-top:30px;">

<img src="xiaomi/images/logo.png" class="l" style="padding-right:5px;">

<a href="">小米商城</a>&nbsp;|

<a href="">MIUI</a>&nbsp;|

<a href="">米家</a>&nbsp;|

<a href="">米聊</a>&nbsp;|

<a href="">多看</a>&nbsp;|

<a href="">游戲</a>&nbsp;|

<a href="">路由器</a>&nbsp;|

<a href="">米粉卡</a>&nbsp;|

<a href="">政企服務(wù)</a>&nbsp;|

<a href="">小米天貓店</a>&nbsp;|

<a href="">隱私政策</a>&nbsp;|

<a href="">商城用戶協(xié)議</a>&nbsp;|

<a href="">賬號協(xié)議</a>&nbsp;|

<a href="">問題反饋</a>&nbsp;|

<a href="">廉正舉報</a>&nbsp;|

<a href="">誠信合規(guī)</a>&nbsp;|

<a href="">Select Region</a>            

<br/>? <span>mi.com</span> 京ICP證110507號 <span>京ICP備10046444號</span> <span>京公網(wǎng)安備11010802020134號</span> <span>京網(wǎng)文[2017]1530-131號</span>

<br/><span>(京)網(wǎng)械平臺備字(2018)第00005號</span> <span>互聯(lián)網(wǎng)藥品信息服務(wù)資格證 (京) -非經(jīng)營性-2014-0090</span> <span>營業(yè)執(zhí)照</span> <span>醫(yī)療器械公告</span>

<br/><span>增值電信業(yè)務(wù)許可證</span>  網(wǎng)絡(luò)食品經(jīng)營備案(京)【2018】WLSPJYBAHF-12   <span>食品經(jīng)營許可證</span>

<br/>違法和不良信息舉報電話:185-0130-1238 <span>知識產(chǎn)權(quán)侵權(quán)投訴</span> 本網(wǎng)站所列數(shù)據(jù),除特殊說明,所有數(shù)據(jù)均出自我司實驗室測試


</div>

</footer>


<script>

//通過js控制,動態(tài)修改相應(yīng)的樣式,達到圖片輪播的效果

/*圖片輪播*/

var slideShowContainer = document.getElementById("slideShowContainer");

var pic = document.getElementById("picUl").getElementsByTagName("li");

var dot = document.getElementById("dotUl").getElementsByTagName("li");

var index = 0;

var timer = null;

/*定義圖片切換函數(shù)*/

function changePic (curIndex) {

for(var i = 0;i < pic.length;++i){

pic[i].style.display = "none";

dot[i].className = "unselected";

}

pic[curIndex].style.display = "block";

dot[curIndex].className = "selected";

}

/*index超出圖片總量時歸零*/

function autoPlay(){

if(+index >= pic.length){

index = 0;

}

changePic(index);

index++;

}

/*定義并調(diào)用自動播放函數(shù)*/

timer = setInterval(autoPlay,1500);

/*鼠標(biāo)劃過整個容器時停止自動播放*/

slideShowContainer.onmouseover = function(){

clearInterval(timer);

}

/*鼠標(biāo)離開整個容器時繼續(xù)播放下一張*/

slideShowContainer.onmouseout = function(){

timer = setInterval(autoPlay,1500);

}

/*遍歷所有數(shù)字導(dǎo)航實現(xiàn)劃過切換至對應(yīng)的圖片*/

for(var i = 0;i < dot.length;i++){

dot[i].onmouseover = function(){

clearInterval(timer);

index = this.innerText-1;

changePic(index)

}

}


//頂部導(dǎo)航條下拉圖片框,左側(cè)導(dǎo)航欄右拉圖片框 移上顯示、移出隱藏

function fa(ele){

ele.nextElementSibling.style.display='block';

}

function fa1(ele){

ele.nextElementSibling.style.display='none';

}


</script>

</body>

</html>



*{margin:0px;padding:0px;}

.mc{margin:0px auto;width:1226px;}

.mt{margin-top:10px;}

.mbt{margin-bottom:10px;}

.l{float:left;}

.r{float:right;}

.clear{clear:both;}

a{text-decoration: none;text-align: center;}


/* 頭部 */

header{width:100%;height:40px;background-color:#333;}

header a{text-decoration: none;border-right:1px solid #423B36;float:left;padding:0px 7px;color:#b0b0b0;}

header a:hover{color:white;}

.hc{width:1226px;height:30px;text-align: center;line-height: 16px;padding:12px 0px;font-size:12px;}


.mcontentup{background-color:#fff;}

main a{float:left;text-decoration: none;text-align: center;color:#333;}

/* 主體頂部導(dǎo)航條 */

.mch_l{width:230px;}

.mch_m>a{font-size:16px;line-height: 56px;padding:0px 10px;}

.mch_m>a:hover{color:#ff5700;}

.mch_r{width:300px;height:54px;background-color:#fff;}

.mch_img{display:none;width:100%;height:230px;background-color:#fff;border-top:1px solid #e0e0e0;

border-bottom:1px solid #e0e0e0;text-align: center;position: absolut

Correcting teacher:韋小寶Correction time:2019-02-11 10:23:21
Teacher's summary:不錯不錯 寫的很完整!代碼寫的也很規(guī)范!像這種有外部引入的樣式或者js可以截圖放上來哦!

Release Notes

Popular Entries