<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>京东</title>
<link rel="stylesheet" href="css/index.css">
<link rel="shortcut icon" href="favicon.ico">
<script language="javascript" type="text/javascript"src="js/index.js" ></script>
</head>
<body>
<!--头部-->
<div class="shortcut">
<div class="w">
<!--nav的left-->
<div class="fl">
<div class="dt">
送至：北京<i><s>◇</s></i>
</div>
</div>
<!--nav的right-->
<div class="fr">
<ul>
<li>
<a href="#">你好，请登录</a>
<a href="#" class="col-red">免费注册</a>
</li>
<li class="line"></li>
<li>我的订单</li>
<li class="line"></li>
<li class="fore">我的京东
<i><s>◇</s></i>
</li>
<li class="line"></li>
<li>京东会员</li>
<li class="line"></li>
<li>业务采购</li>
<li class="line"></li>
<li class="fore tel-jd">
<em class="tel"></em>手机京东
<i><s>◇</s></i>
</li>
<li class="line"></li>
<li class="fore">关注京东
<i><s>◇</s></i>
</li>
<li class="line"></li>
<li class="fore">客户服务
<i><s>◇</s></i>
</li>
<li class="line"></li>
<li class="fore">网站导航
<i><s>◇</s></i>
</li>
</ul>
</div>
</div>
</div>
<!--京东的头部导航结束-->
<!--第二部分-->
<div class="topbanner">
<div class="w tp">
<img src ="img/banner.jpg">
<a href="#"class="close-banner" ></a>
</div>
</div>
<!--第二部分完成-->
<!--第三部分-->
<div class="sole">
<div class="w three">
<div class="JD"><img src="image/logo-201305.png"/></div>
<div class="ss">
<input type="text"value="二合一平板" />
<button>搜索</button>
<ul>
<li>手机钜惠</li>
<li>送扫地把</li>
<li>农用物资</li>
<li>299减60</li>
<li>萌宠巨惠</li>
<li>乔丹</li>
<li>男装</li>
<li>1元专享</li>
</ul>
</div>
<div class="che">
<a href="#">我的购物车</a>
<span class="icon1"></span>
<span class="icon2">></span>
<span class="icon3">0</span>
</div>
</div>
</div>
<!--第三部分完-->
<!--第四部分-->
<div class="four">
<div class="w fenei">
<div class="fenei1"><p>全部商品分类</p> </div>
<div class="fenei2">
<ul>
<li>服装城</li>
<li>美妆馆</li>
<li>京东超市</li>
<li>生鲜</li>
<li>全球购</li>
<li>闪购</li>
<li>团购</li>
<li>拍卖</li>
<li class="new">金融</li>
</ul>
</div>
</div>
</div>
<!--线-->
<div class="line1"></div>
<!--第四部分完-->
<!--商品的分类-->
<div class="species">
<div class="w species1">
<div class="species2">
<ul>
<li>家用电器
<span> > </span>
</li>
<li>手机、运营、商数码
<span> > </span>
</li>
<li>电脑、办公
<span> > </span>
</li>
<li>家居、家具、家装、厨具
<span> > </span>
</li>
<li>男装、女装、童装、内衣
<span> > </span>
</li>
<li>个护化妆、清洁用品、宠物
<span> > </span>
</li>
<li>鞋靴、箱包、珠宝、奢侈品
<span> > </span>
</li>
<li>运动、户外、钟表
<span> > </span>
</li>
<li>汽车、汽车用品
<span> > </span>
</li>
<li>母婴、玩具乐器
<span> > </span>
</li>
<li>食品、酒类、生鲜、特产
<span> > </span>
</li>
<li>医药保健
<span> > </span>
</li>
<li>图书、音像、电子书
<span> > </span>
</li>
<li>彩票、旅行、充值、票务
<span> > </span>
</li>
<li>理财、众筹、白条、保险
<span> > </span>
</li>
</ul>
</div>
<div class="spimage">
<img src="image/slider1.jpg" id="tuID"/>
<ul id="ulID">
<li id="l1ID">1</li>
<li id="l2ID" >2</li>
<li id="l3ID" >3</li>
<li id="l4ID" >4</li>
<li id="l5ID" >5</li>
<li id="l6ID" class="liu">6</li>
</ul>
<div class ="yinying" id="yinyingID">
<div id="yin-leftID" class="yinying-left"><</div>
<div id="yin-rightID" class="yinying-right">></div>
</div>
</div>
<script type="text/javascript">
var count=0;
window.onload =function(){
function $(id){
return document.getElementById(id);
}
var dian= new Array($("l1ID"),$("l2ID"),$("l3ID"),$("l4ID"),$("l5ID"),$("l6ID"));
var arrbox= new Array("image/bigBanner01.jpg","image/bigBanner02.jpg","image/bigBanner03.jpg","image/bigBanner04.jpg","image/bigBanner05.jpg","image/bigBanner06.jpg");
function ljy(){
alert("sdf");
}
//定时器
function time(){
if(count>=5){
count=-1;
}
count++;
var times=count+"";
interface(count);
}
var stop=setInterval(time,1000);
//第一个点为红色
dian[0].style.backgroundColor="red";
//响应事件
$("l1ID").onmouseover =function(){
interface(0);
}
onmouseover="interface(0)"
$("l2ID").onmouseover =function(){
interface(1);
}
dian[2].onmouseover =function(){
interface(2);
}
$("l4ID").onmouseover =function(){
interface(3);
}
$("l5ID").onmouseover =function(){
interface(4);
}
$("l6ID").onmouseover=function(){
interface(5);
}
//函数
function interface(number){
//背景颜色全清除
for(var i=0;i<dian.length;i++){
dian[i].style.backgroundColor="";
}
$("l6ID").style.backgroundColor="black";
//对应的参数
count=number;
//图片的选择
$("tuID").src=arrbox[number];
//颜色
dian[number].style.backgroundColor="red";
}
//显示阴影
$("tuID").onmouseover= function(){
$("yinyingID").style.display="block";
}
$("tuID").onmouseout =function(){
$("yinyingID").style.display="none";
}
//向左移动
$("yin-leftID").onclick =function(){
if(count<=0){
count=6;
}
count--;
interface(count);
}
// 向右移动
$("yin-rightID").onclick =function(){
if(count>=5){
count=-1;
}
count++;
interface(count);
}
}
</script>
<!--京东-->
<div class="kuaibao">
<div class="jd-new">
<span>京东快报</span>
<a href="#"> 更多> </a>
</div>
<div class="jd-news">
<ul>
<li><span>［特惠］</span><a href="#"> 强韧满分 唤醒元气秀发 </a></li>
<li><span>［公告］</span><a href="#">山姆会员商店全面入驻京东商城 </a></li>
<li><span>［特惠］</span><a href="#">山姆会员店盛大开业，全店热销 </a></li>
<li><span>［公告］</span><a href="#">广东、福建受台风影响配送延迟 </a></li>
<li><span>［特惠］</span><a href="#">5折神券提前抢！ </a></li>
</ul>
</div>
<div class="gezi">
<ul>
<li><img src="img/one.png"/><p>话费</p> </li>
<li><img src="img/two.png"/> <p>机票</p> </li>
<li><img src="img/three.png" /> <p>电影票</p> </li>
<li><img src="img/four.png" /> <p>游戏</p> </li>
<li><img src="img/five.png" /> <p>彩票</p> </li>
<li><img src="img/six.png" /> <p>加油卡</p> </li>
<li><img src="img/seven.png" /> <p>酒店</p> </li>
<li><img src="img/eight.png" /> <p>火车票</p> </li>
<li><img src="img/nine.png" /> <p>众筹</p> </li>
<li><img src="img/ten.png" /> <p>理财</p> </li>
<li><img src="img/eleven.png" /> <p>礼品卡</p> </li>
<li class="juan"><img src="img/Twelve.png" /> <p>白条</p> </li>
</ul>
</div>
<div class="mx">
<img src="image/121313.png"/>
</div>
</div>
</div>
</div>
<!--商品分类完-->
<!--商品分类的下面-->
<div class="tuijian">
<div class="w tuijian1">
<div class="jin">
<img src="img/Snip20161026_8.png"></div>
<div class="tuijian-image">
<img src="image/1.jpg"/>
<img src="image/2.jpg"/>
<img src="image/3.jpg"/>
<img src="image/4.jpg"/>
<div class="yy">
<div class="yy-l"></div>
<div class="yy-r"></div>
</div>
</div>
</div>
</div>
<!--第五部分-->
<div class="five">
<div class="w dkhs">
<img src="image/slogen1.png"/>
<img src="image/slogen2.png"/>
<img src="image/slogen3.png"/>
<img src="image/slogen4.png"/>
</div>
</div>
<!--第五部分完-->
<!--第六部分-->
<div class="six">
<div class="w gwzn">
<dl>
<div class="gouwu">
<dt class="ziti">购物指南</dt>
<div class="ziti1">
<dd>购物流程</dd>
<dd>会员介绍</dd>
<dd>生活旅游团购</dd>
<dd>常见问题</dd>
<dd>大家电</dd>
<dd>联系客服</dd>
</div>
</div>
<div class="gouwu">
<dt class="ziti">配送方式</dt>
<div class="ziti1">
<dd>上门自提</dd>
<dd>211限时达</dd>
<dd>配送服务查询</dd>
<dd>配送费收费标准</dd>
<dd>海外配货</dd>
</div>
</div>
<div class="gouwu">
<dt class="ziti">支付方式</dt>
<div class="ziti1">
<dd>货到付款</dd>
<dd>在线支付</dd>
<dd>分期付款</dd>
<dd>邮局汇款</dd>
<dd>公司转账</dd>
</div>
</div>
<div class="gouwu">
<dt class="ziti">售后服务</dt>
<div class="ziti1">
<dd>售后政策</dd>
<dd>价格保护</dd>
<dd>退款说明</dd>
<dd>返修／退换货</dd>
<dd>取消订单</dd>
</div>
</div>
<div class="gouwu">
<dt class="ziti">特色服务</dt>
<div class="ziti1">
<dd>夺宝岛</dd>
<dd>DIY装机</dd>
<dd>延保服务</dd>
<dd>京东E卡</dd>
<dd>京东通信</dd>
<dd>京东JD＋</dd>
</div>
</div>
<div class="gouwu map">
<dt class="ziti">京东自营覆盖区县</dt>
<div class="ziti1">
京东已向全国2654个县区提供自营配送服务，支持货到付款、POS机 刷卡和售后上门服务
<p>查询详情></p>
</div>
</div>
</dl>
</div>
</div>
<!--第六部分完-->
<div class="w line2"></div>
<!--第七部分-->
<div id="line2"> </div>
<div class="seven">
<div class="w fuwu">
<div class="fuwu1">
<ul>
<a href="#">关于我们</a> |
<a href="#"> 联系我们</a> |
<a href="#">联系客服</a> |
<a href="#">商家入驻</a> |
<a href="#">营销中心</a> |
<a href="#">手机京东</a> |
<a href="#">友情链接</a> |
<a href="#">销售联盟</a> |
<a href="#">京东社区</a> |
<a href="#">风险监测</a> |
<a href="#">京东公益</a> |
<a href="#">English Site</a> |
<a href="#">Contact Us</a>
</ul>
</div>
<div class="fuwu2">
<img src="image/Snip20161026_4.png"/> 11000002000088号 | 京ICP证070359号 | 互联网药品信息服务资格证编号(京)-经营性-2014-0008 | 新出发京零 字第大120007号
<br/>互联网出版许可证编号新出网证(京)字150号 | 出版物经营许可证 | 网络文化经营许可证京网文[2014]2148-348号 | 违法和不良信息举报电话：4006561155
Copyright © 2004 - 2016 京东JD.com 版权所有 | 消费者维权热线：4006067733
<br/>京东旗下网站：京东钱包
</div>
<div class="fuwu3">
<a href="#"><img src="img/mess.png" alt="" /></a>
<a href="#"><img src="img/mess2.png" alt="" /></a>
<a href="#"><img src="img/mess3.png" alt="" /></a>
<a href="#"><img src="img/mess4.png" alt="" /></a>
<a href="#"><img src="img/mess5.png" alt="" /></a>
</div>
</div>
</div>
</body>
</html>
