[英]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.