极客观点
项目管理
HarmonyOS
下面是我的代码，求大神帮我看看我哪里写错了；
我要的效果是；默认情况UI是向右滚动。然后当我点击左上角的 向左走 时，弹出对话窗口。在对话窗口里输入 滚动的速度，然后点击确定，UI就可以向左或向右以在对话窗口里输入的数值的速度来滚动；但我现在在对话窗口里输入数值点击确定后，UI就不停的闪。。。。请大神帮我看一下我哪里写错了。谢谢哈；
这个是我代码的DEMO
http://psgui.com/JS%E5%AD%A6%E4%B9%A0/0008.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
*{
margin:0px;
padding:0px;
}
.gun_box1{
height:100px;
background-color:#998811;
position:relative;
margin:20px auto;
overflow:hidden;
}
.gun_box1 ul{
position:absolute;
top:0;
left:0;
/*width:1000px;*/
}
.gun_box1 ul li{
float:left;
margin-right:10px;
width:100px;
height:100px;
background-color:#118833;
list-style-type:none;
white-space:nowrap;
}
#bai{
color:#000000;
background-color:#ffff33;
}
</style>
<script>
function getCSS(obaj, nade){ //字义一个函数，获取样式表里面类里的属性于值；obaj指的是对角,nade属性名称
if(obaj.currentStyle){
return obaj.currentStyle[nade];
}
else{
return getComputedStyle(obaj, false)[nade];
}
};
window.onload = function(){
var odiv_box1 = document.getElementById('odiv_1');
var oul_box1 = odiv_box1.getElementsByTagName('ul')[0];
var oli_box1 = oul_box1.getElementsByTagName('li');
var oInput_left = document.getElementById('input_left1');
var oInput_right = document.getElementById('input_right1');
var input_timed1 = document.getElementById('input_timed');
var zheng = -4;
var timed = 3000;
oul_box1.innerHTML = oul_box1.innerHTML + oul_box1.innerHTML; //复制一份LI出来
oul_box1.style.width = (oli_box1[0].offsetWidth*oli_box1.length) + (parseInt(getCSS(oli_box1[0], 'marginRight')) * oli_box1.length) + 'px'; //让UL的宽度等于每个LI的单个宽度*LI的个数 + marginRight*li的个数；
odiv_box1.style.width = parseInt(oul_box1.style.width) / 2 + 'px'; //将oul_box1的宽度获取到并转换为数字然后除2，再赋值给odiv_box1的宽度
//alert(parseInt(oul_box1.style.width) / 2); //parseInt();将字符串转换为数字
//alert(oli_box1[0].offsetWidth*oli_box1.length);
//alert(parseInt(getCSS(oli_box1[0], 'marginRight')) * oli_box1.length ); //获取 oli_box1 样式表 .gun_box1 ul li 中 margin-right 的值后将期转换为 //数后，然后* oli_box1的个数；
var steds = null;
function moyou(){
if(oul_box1.offsetLeft <- oul_box1.offsetWidth/2){ //oul_box1的offsetLeft 小余并减 oul_box1.offsetWidth二分之一时oul_box1的left值为0；
oul_box1.style.left = '0';
}
if(oul_box1.offsetLeft > 0){ //如果向右移动的话就是oul_box1的offsetLeft大于0的时候实行里面的语句；
oul_box1.style.left =-oul_box1.offsetWidth/2 + 'px'; //如果oul_box1.offsetLeft大余0就让oul_box1的left等于负的oul_box1.offsetWidth的2分之一
}
oul_box1.style.left = oul_box1.offsetLeft + zheng +'px'; //oul_box1每XX毫秒向左移动 zheng 个像素；
}
steds = setInterval(moyou, timed);
odiv_box1.onmouseover = function(){
clearTimeout(steds);
};
odiv_box1.onmouseout = function(){
steds = setInterval(moyou, timed);
};
//下面的代码是点击向左走后弹出对话窗口，在对话窗口里输入速度点击确定后，把输入的速度值赋给变量zheng;
oInput_left.onclick = function(){
var pros= prompt('请输入速度','这里输入');
if(pros){
zheng=parseInt(-pros);//点击后向左走
}
};
oInput_right.onclick = function(){
var pros=prompt('请输入速度', '这里输入');
if(pros){
zheng=parseInt(pros);//点击后向右走
}
};
input_timed1.onclick = function(){
var timed_speed=prompt('请输入时间1000=1秒', timed);
if(timed_speed){
timed=parseInt(timed_speed);
}
alert(timed);
};
};
</script>
</head>
<body>
<input type="button" value="向左走" id="input_left1">
<input type="button" value="向右走" id="input_right1">
<input type="button" value="生隔几秒滚动一次" id="input_timed">
<div class="gun_box1" id="odiv_1">
<ul>
<li id="bai"><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li><a href="#">6</a></li>
<li><a href="#">7</a></li>
<li><a href="#">8</a></li>
<li><a href="#">9</a></li>
</ul>
</div>
</body>
</html>
