请问哪里的问题

请问哪里的问题


<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

<title>图片轮播</title>

<link rel="stylesheet" href="..\css\css1.css">

<script src="..\js\js1.js"></script>

</head>

<body>

<div class="main" id="main">

<!-- 标题 -->

<div class="tit">

<ul>

<li>首页</li>

<li>点击看看</li>

<li>会自动的</li>

<li>我的网站</li>

</ul>

    </div>

<!-- 切换项内容 -->

<div class="content" id="content">

<div class="p1 active"><img src="..\img\1.jpg" alt=""></div>

<div class="p2"><img src="..\img\2.jpg" alt=""></div>

<div class="p3"><img src="..\img\3.jpg" alt=""></div>

    <div class="p4"><img src="..\img\4.jpg" alt=""></div>

    </div>

</div>

<div class="none"></div>

</body>

</html>

------------------------------------------------------------------------

*{

margin: 0;padding: 0;

}


.main{

margin-top:7px;

width: 100%;

border: 1px dashed #ccc;

}


.tit ul li{

font-size: 22px;

color:#666;

float: left;

list-style:none;

text-align: center;

width: 25%; 

    height: 60px; 

    line-height: 60px; 

    cursor: pointer;

      }

 .content{

  width: 100%;

  position: absolute;

  top: 68px;

 }

 .p1,.p2,.p3,.p4{

  text-align: center;

  display: none;

 }

 .active{

  display: block;

 }

 .none{

margin-top: 100px;


}

=--------------------------------------------

var main=document.getElementById("main"),

    index=0,

    timer=null,

    pics=document.getElementById("content").getElementsByTagName("div"),

    lis=document.getElementsByTagName("li")

    ;


function slideImg(){

//鼠标滑过清除定时器

main.onmouseover=function(){

if(timer) clearInterval(timer);

 }


//鼠标移开,定时器操作

main.onmouseout=function (){

timer=setInterval(function(){

index++;

if(index>=pics.length){ index=0;}

changeImg();

}, 1000); 

  }

  main.onmouseout();

  //点导航切换图片

  for(var j=0;j<pics.length;j++){

  lis[j].id="l"+d;

  lis[j].onclick=function(){

  index=this.id;

  changeImg();

  }

  }


}

function changeImg(){

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

pics[i].style.dispaly="none";

lis[i].style.background="";


}

pics[index].style.display="block";

lis[i].style.background="#ffcc00";

}

slideImg();


正在回答

登陆购买课程后可参与讨论,去登陆

1回答

运行了你的代码,控制台报错,

1. 获取不到pics,因为html页面还没有加载完成,所以Js文件获取不到,建议使用onload事件,如图所示:http://img1.sycdn.imooc.com//climg/5ae938d90001f70303270309.jpg

2. d没有定义

http://img1.sycdn.imooc.com//climg/5ae929fd000199e905840075.jpghttp://img1.sycdn.imooc.com//climg/5ae92a2a0001a6a905500342.jpg

3. 没有放在for循环中,lis[i]获取不到

http://img1.sycdn.imooc.com//climg/5ae92a510001e95b08030089.jpg

http://img1.sycdn.imooc.com//climg/5ae92a5c0001ee0905120108.jpg

如果还有其他的问题,可以继续提问,助教老师会及时为你答疑解惑。

祝学习愉快!


  • 一只大懒喵 提问者 #1
    非常感谢!
    2018-05-02 20:23:41
  • 一只大懒喵 提问者 #2
    为什么我的控制台什么也没有,是不是哪里点错了让他不显示了
    2018-05-02 20:24:18
  • 妮可妮可妮_ 回复 提问者 一只大懒喵 #3
    你可以截图一下完整的控制台看看吗,光用语言描述我猜不到是哪里出了问题
    2018-05-03 09:53:48
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师