ループ内の背景画像を移動する

Question

[ウェブサイト] [1]と同じように、ページの対角線上に背景画像を移動したいのですが、「ウェブサイト開発者」、「SEOコンサルタント」、この効果を達成する方法を提案してください。

Answer 1

これには多くのオプションがあります。

<div></div>

div { 
 
    background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/d/de/Fonte_Gaia_-_she_wolf_detail.jpg/500px-Fonte_Gaia_-_she_wolf_detail.jpg"); 
 
    background-repeat:no-repeat; 
 
    background-attachment:fixed; 
 
    background-size:cover; 
 
    background-position:center-top; 
 
    background-position-x: 50%; 
 
    background-position-y: 0%; 
 
    -webkit-animation: zoomin 5s 1; 
 
} 
 

 
@-webkit-keyframes zoomin { 
 
    0% { 
 
     -webkit-transform: scale(1); 
 
    } 
 
    100% { 
 
     -webkit-transform: scale(2); 
 
    } 
 

 
}

Answer 2

（これは、ループ内で背景画像を変更する方法を理解することです。パブロの答え@見、それを移動する方法を参照するには）

this fiddle
はこれをしなかった参照してください。配列を使用してリンクを保存し、次のjavascriptを使用してそれらを通過させます：

function changeBGImage() { 
    document.getElementById("main").style.backgroundImage = "url('" + images[next] + "')"; 
    next++; 
    next %= 3; 
} 

P.S.配列のイメージ数を3として使用