Javascriptのイメージトリック

Question

$(document).ready(function() { 

var count = 0; 
var images = [ 
    "http://79.115.69.135:8521/UnderConstruction/Images/deestiny.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/dishonored.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/fallout4.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/fc3.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/halo5.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/me-som.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/rise.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/road4.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/southpark.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/subzero.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/tesv.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/thief.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/watchdogs.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/me-sow.jpg", 
    "http://79.115.69.135:8521/UnderConstruction/Images/wot.jpg", 

]; 
var image = $(".background"); 

image.css("background-image", "url(" + (images[count] + ")")) 

setInterval(function() { 
    image.fadeOut(1500, function() { 
     image.css("background-image", "url(" + images[count++] + ")"); 
     image.fadeIn(1500); 
    }); 
    if (count == images.length) { 
     count = 0; 
    } 
},10000);  }); 

私は新しいイメージを追加するたびに、私はhttp://ip.com/folder/folder/img.imgで新しい行を記述する必要が....このJavaScriptコードを持っている... 1.Howは、私はそれがために作ることができますランダム...ランダムな画像を選択！ 2. ip.comで1行だけを作る方法...画像を追加したいときに改行したことはありません！乱数について

For Dev who are courious

Answer 1

は：

MDNから適応：maxはimages.lengthある

function getRandomNumber(max) { 
    return Math.floor(Math.random() * max); 
} 

。 0からimages.length - 1の間の乱数が得られます。文字列の連結については

：

var baseUrl = "http://79.115.69.135:8521/UnderConstruction/Images/" 

あなただけのファイル名を維持する、配列の各要素で長い文字列を削除することができます。私はその後、私が取得する機能を使用

var getRandomNumber = function (max) { 
    return Math.floor(Math.random() * max) 
} 

関数を定義

まず：

image.css("background-image", "url(" + baseUrl + images[count] + ")") 

編集：何か（も、あなたはあまりにも多くの括弧を持っていた）のように次に、あなただけ行うことができます最初の画像：

var randomNumber = getRandomNumber(images.length) 
image.css("background-image", "url(" + baseUrl + images[randomNumber] + ")") 

次に、setIntervalの関数を使用して乱数新しい番号が古いものと同じであるかどうかをチェックして、同じイメージを2度選んではいけないようにすることもできます（ただし、その方法を理解するために残しておきます）。

setInterval(function() { 
    image.fadeOut(1500, function() { 
    randomNumber = getRandomNumber(images.length) 
    image.css("background-image", "url(" + baseUrl + images[randomNumber] + ")"); 
    image.fadeIn(1500); 
    }); 
},10000); }); 

最終編集：

$(document).ready(function() { 

    var images = [ 
    '1.png', 
    '2.png', 
    '3.png', 
    '4.png' 
    ] 

    var image = $('.background') 

    // build the function 
    var getRandomNumber = function (max) { 
    return Math.floor(Math.random() * max) 
    } 
    // set a variable to receive a value 
    var randomNumber = getRandomNumber(images.length) 

    // use the value to index into the array 
    image.css('background-image', 'url(' + (images[randomNumber] + ')')) 

    setInterval(function() { 
    var lastRandomNumber = randomNumber 
    // and then do it again, every time 
    randomNumber = getRandomNumber(images.length) 
    // you could also check whether or not it's the same number and do it over 
    while (randomNumber === lastRandomNumber) { 
     randomNumber = getRandomNumber(images.length) 
    } 
    image.fadeOut(1500, function() { 
     image.css('background-image', 'url(' + images[randomNumber] + ')') 
     image.fadeIn(1500) 
    }) 
    }, 10000) 
})