为什么我在这里设置pic的left没有用！求大佬解救
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
*{margin: 0px;padding: 0px;}
#pi{margin: 50px auto;width: 470px;height: 250px;
background-color: aquamarine;padding:10px ;auto; position: relative;overflow: hidden;}
#pic{list-style: none;position:absolute;}
#pic li{float: left;margin: 0 10px;}
#leader{position: absolute;bottom: 15px;}
#leader a{background-color: #00FFFF;float: left;width: 15px;height: 15px;margin:0 10px;
opacity: 0.5;}
#leader a:hover{background-color: black;}
</style>
<script type="text/javascript">
window.onload = function(){
var pic = document.getElementById("pic")
var img = document.getElementsByTagName("img")
pic.style.width = (img.length*520)+"px"
var pi =document.getElementById("pi")
var leader= document.getElementById("leader")
leader.style.left = (pi.offsetWidth - leader.offsetWidth)/2 +"px";
//使导航栏选中图片变成黑色.
var index = 0;
var alla = document.getElementsByTagName("a")
alla.style.backgroundColor = "#000000"
for(var i=0;i<alla.length;i++)
{
alla.num = i;
alla.onclick = function(){
index = this.num;
alert(index)
-------------->pic.style.left="-520px";
};
};
}
</script>
</head>
<body>
<div id="pi">
<ul id="pic">
<li><img src="qq/1.jpg" width="450px" height="250px"></li>
<li><img src="qq/2.jpg" width="450px" height="250px"></li>
<li><img src="qq/3.jpg" width="450px"height="250px"></li>
</ul>
<div id="leader">
<a href=""></a>
<a href=""></a>
<a href=""> </a>
</div>
</div>
</body>
</html>
1、去掉图中方框中代码：
按照0，1，2正常切换：
不二如是 发表于 2019-7-19 07:44
1、去掉图中方框中代码：
那个符号是我打上去。。。标识不懂的地方。文件我不知道怎么发上来，所以没有图片，如果left变化了，图片就应该变动的。。但是没有变化。。 for (var i = 0; i < alla.length; i++) {
alla.num = i;
alla.onclick = function() {
index = this.num;
alert(index)
alert(pic.style.left)
pic.style.left = "-520px";
alert(pic.style.left)
};
你加这一句上去，就能看到一开始 pic.style.left 就是不存在的
页:
[1]