ID「art」のdivがあります。この div には、背景「S1_img1.jpg」が必要です。div の下にボタンがあり、それをクリックすると、背景画像が「S1_img2.jpg」に変更される必要があります。
もう一度クリックすると、「S1_img3.jpg」に変わり、そのように続きます。ただし、img4 は最後の 1 つです。つまり、div の背景が現在 img4 に設定されていて、もう一度ボタンをクリックすると、img1 に戻る必要があります。
JavaScriptを使用してこれを達成しようとしていますが、機能させることができません。
1) 以下のコードを使用すると、画像のパスが正しいと確信していても、画像が背景として表示されません。
<script type="text/javascript">
document.getElementById("art").style.backgroundImage = "url(content/art/S1/S1_img1.jpg)";</script>
2)説明したようにボタンをクリックすると背景が変わるようにするにはどうすればよいですか?
現時点では、ボタンの onClick が JavaScript 関数「count();」を実行しています。
<script type="text/javascript">
var img = 1;
function count() {
img = img + 1;
document.getElementById("content").style.backgroundImage = "url(content/art/S3/S3_img1.jpg)";
}
</script>