背景画像を変化させる
背景画像を1枚ずつ変化させていく方法を教えてください。下記サイトのように、クリックで変化させたいです。
https://weplus.jp/
0
背景画像を1枚ずつ変化させていく方法を教えてください。下記サイトのように、クリックで変化させたいです。
https://weplus.jp/
丸投げするのではなく、自分ではどこまで実装できて、どこで躓いていて、何が分かれば解決するかを、自分が書いたコードを提示するなどして説明することはできますか?
jsでクリックイベントを検知して背景画像を変えるように実装する。
<script src="https://code.jquery.com/jquery-3.7.0.js"></script>
<script>
var urls=[
"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQuwmozf-6kft8qyEqujFCjDOSfFwSfdUAJzg&s",
"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQuwmozf-6kft8qyEqujFCjDOSfFwSfdUAJzg&s",
"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQuwmozf-6kft8qyEqujFCjDOSfFwSfdUAJzg&s",
"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQuwmozf-6kft8qyEqujFCjDOSfFwSfdUAJzg&s",
];
var backgroundIndex=0;
function changeBackground(){
backgroundIndex++;
if (backgroundIndex>=urls.length)backgroundIndex=0;
$("body").css("background-image","url('"+urls[backgroundIndex]+"')")
}
</script>
<body onclick="changeBackground()">