私はW3Schools JavaScriptの章を読んで、イメージスライドを作成しようとしています。私はすべてを最初に行い、最初のラウンドでは適切に動作します。たとえば、次のボタンをクリックすると、スライドショーの最後までスライドがスライドしていき、もう一度クリックすると、すべてのものがリセットされますが、それ以降は動作しません。また、DocTypeの減速を含めると、最初から動作しなくなります。JavaScriptイメージスライダが1ラウンドで機能しますか?
<html lang="en">
<head>
<title>
Project Name
</title>
<style>
*
{
margin: 0px;
padding: 0px;
}
body
{
margin: 25px;
}
#slideshow
{
width : 300px;
height: 300px;
border: 1px solid #000;
margin: 0 auto;
}
#slides
{
position: relative;
width: 900px;
height: 300px;
transition: 1s;
}
.slide
{
width : 300px;
height: 300px;
float: left;
}
</style>
</head>
<body>
<div id="slideshow">
<div id="slides">
<img class ="slide" src="images/slide1.jpg">
<img class="slide" src="images/slide2.jpg">
<img class="slide" src="images/slide3.jpg">
</div>
</div>
<button onclick="prev()">prev</button>
<button onclick="next()">next</button>
<script type="text/javascript">
var value = 300;
function next()
{
var slider = document.getElementById("slides");
if(value == 900)
{
slider.style.left = "0";
value = 300;
}
else
{
slider.style.right = value;
value += 300;
}
}
</script>
</body>
CSS「左」と「右」には単位が必要です。 '' px ''を追加してください。 – Xufox
まだ1ラウンドで働いています –
あなたの質問に基本的な文法を適用してください:文章は大文字で始まり、ピリオド(。)で終わります。これは私の脳を傷つける。 – Sumurai8