0
小さなスライダーを作ろうとしますが、Google Chromeでのみ動作します。CSSスライダーがFireFoxで動作しない
FireFox（バージョン47）では動作しません。
#home-container {
width: 500px;
height: 300px;
background-image: url("img1.jpg");
background-repeat: no-repeat;
background-size: cover;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
}
と（小さなスクリプト付き）HTML：：
<!DOCTYPE html>
<html>
<head>
<title>CSS Slider</title>
<link rel="stylesheet" href="style.css"/>
<script>
var index = 0;
function changeImage() {
var imgArr = ['img1.jpg', 'img2.jpg', 'img3.jpg'];
document.getElementById("home-container").style.backgroundImage = "url('" + imgArr[index] + "')";
index++;
if (index >= imgArr.length) {
index = 0;
}
}
setInterval(changeImage, 2000);
</script>
</head>
<body>
<div id="home-container">
</div>
</body>
</html>
PS：私はそのコードではなく、jQueryのを使用するための代替のためのソリューションを必要と
CSSファイルがあることです。
あなたはそれがうまくいかないと言ったら、どういう意味ですか？エラーはありますか？行動は予期しないものですか？ @Doro – Mark
これは何をすべきかではありません。たとえば、Chromeでは画像がスライドエフェクトで変更されますが、Firefoxでは即座に効果が変わります。 – Doro