[英]Style.width and left doesn't work
我想在具有此背景的菜单div中制作“照片带”的效果
我更改了div的宽度和左侧，以使用javascript / jquery模拟这种效果，但这种方式无法正常工作，目前是“ onclick”，但我想使其自动与setInterval一起使用吗？
这是HTML代码：
<!DOCTYPE html>
<html>
<head>
<title>Prueba</title>
<link type = "text/css" rel = "stylesheet" href = "PruebaIndex.css">
<script type = "text/javascript" src = "jquery-2.1.4.js"></script>
<script>
$(document).ready(function(){
var slider = document.getElementById("#slider");
var speed = 10;
$("#slider").click(function(){
slider.style.width = (slider.style.width+speed)+"px";
slider.style.left = (slider.style.left-speed)+"px";
});
});
</script>
</head>
<body>
<div id = "wrapper">
<div id = "slider">
</div>
</div>
</body>
</html>
这是CSS代码：
*{
padding: 0;
margin: 0;
}
#slider {
padding: 0;
margin: 0;
background-color: black;
background-image: url("TiraFotografica.PNG");
background-repeat: repeat;
width: 800px;
height: 304px;
position: relative;
overflow: hidden;
}
#wrapper {
width: 800px;
height: 1000px;
margin: 0 auto;
text-align: center;
overflow: hidden;
}
我尝试了另一种不同的方式，例如window.onload ，将代码毕竟放在了正文中 ，尝试了$（object）.width等。问题是当我单击此按钮时，它不会移动，然后稍后我将尝试自动做..
我还有一个疑问，这个菜单会进入divs（选项），当我移动该div（“＃slider”）时，那些divs也移动（选项）吗？
编辑：我通过DinoMyte添加了此
var speed = 10;
$("#slider").click(function(){
$(this).css("width",(parseInt($(this).css("width").replace("px","")) + speed) + "px");
$(this).css("left",(parseInt($(this).css("left").replace("px","")) - speed) + "px");
});
现在它可以正常工作，只需要自动执行即可，无需点击
对不起，我的英语不好..
问题在于， slider.style.width会给您宽度+“ px”，因此(slider.style.width+speed)无法使用。 您需要先替换“ px”。 另外，您需要将当前的宽度值解析为整数。
slider.style.width = parseInt(slider.style.width.replace("px","")) +speed)+"px";
更好的方法是：
var speed = 10;
$("#slider").click(function(){
$(this).css("width",(parseInt($(this).css("width").replace("px","")) + speed) + "px");
$(this).css("left",(parseInt($(this).css("left").replace("px","")) - speed) + "px");
});
。的document.getElementById（ '盒子'）style.width =“10px的”; 不起作用？
[英]document.getElementById('box').style.width=“10px”; Doesn't work?
为什么这在JS中不起作用？ getElementById（）。style.width + = 40 +“ px”;
[英]Why this not working in JS?? getElementById().style.width += 40 + “px”;
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.