隨機div內容+背景

這是我的隨機編碼divbackground-image。我只是想知道如何爲每個background添加某些說明div。隨機div內容+背景

<div class="slider"></div> 


$(function() { 
var url = "http://maispc.com/samuel/content/images/", 
    imgArray = [url+"avatar.png", 
       url+"provider/blogger.png", 
       url+"provider/LinkedIn-32x32.png", 
       url+"provider/myspace.png", 
       url+"provider/instagram.png", 
       url+"provider/Twitter-32x32.png", 
       url+"provider/stackoverflow.png", 
       url+"provider/Facebook-32x32.png"], 
    randomNumber = Math.floor((Math.random() * imgArray.length)), 
    baseUrl = "url('" + imgArray[randomNumber] + "')"; 

$(".slider", ".tab").css('background-image', baseUrl); 
})();

是這樣

{ $(function() { 
var url = "http://maispc.com/samuel/content/images/", 
    imgArray = [url+"avatar.png", 
       url+"provider/blogger.png", description div 1 
       url+"provider/LinkedIn-32x32.png",description div 2 
       url+"provider/myspace.png", and so .... 
       url+"provider/instagram.png", 
       url+"provider/Twitter-32x32.png", 
       url+"provider/stackoverflow.png", 
       url+"provider/Facebook-32x32.png"], 
    randomNumber = Math.floor((Math.random() * imgArray.length)), 
    baseUrl = "url('" + imgArray[randomNumber] + "')"; 

$(".slider").css('background-image', baseUrl); 
})(); 

}

來源

2017-10-07 Ehab Mamdouh Ismaiel

什麼是「描述格」？請[編輯]你的問題來解釋所需的行爲是什麼。 – nnnnnn

你對每張幻燈片都有描述嗎？ –

like div content –

製造陣列的所有描述。

HTML：

<div class="slider"> 
    <div class="description"></div> 
</div>

JS：

$(function() { 
    var url = "http://maispc.com/samuel/content/images/"; 
    var imgArray = [url+"avatar.png", 
       url+"provider/blogger.png", 
       url+"provider/LinkedIn-32x32.png", 
       url+"provider/myspace.png", 
       url+"provider/instagram.png", 
       url+"provider/Twitter-32x32.png", 
       url+"provider/stackoverflow.png", 
       url+"provider/Facebook-32x32.png"]; 
    var descriptionArray = ["Description 1", 
       "Description 2", 
       "Description 3", 
       "Description 4", 
       "Description 5", 
       "Description 6", 
       "Description 7", 
       "Description 8"]; 
    var randomNumber = Math.floor((Math.random() * imgArray.length)); 
    var baseUrl = "url('" + imgArray[randomNumber] + "')"; 
    var description = descriptionArray[randomNumber]; 
    $(".slider").css('background-image', baseUrl); 
    $(".description").text(description); 
})();

來源

2017-10-07 14:44:47 grt812

如果我想將.text的description屬性替換爲DIV，如下所示：（「.description」）。text（description）; >>>（「.description」）。div（description）; 它會工作嗎？我應該在var descriptionArray和它的css中更改哪些內容？謝謝 –

'.div（description）;'不是一個函數，所以它不起作用。如果你不想使用'description'類來獲得所有div，你可以使用'（「div.description」）.text（description）;'。 descriptionArray中的每個項目都具有每個對應圖像的所有描述。例如，如果背景圖像是「avatar.png」，則將顯示的描述是「描述1」。 'blogger.png'會有「描述2」。因此，您可以根據使用的圖像更改每個描述。對於CSS，我會確保每個圖像上的文本都可讀，並且如果它不可讀，則爲'.description'添加背景顏色。 – grt812

好，我的內容包括H2，小文本範圍，然後描述， –

隨機div內容+背景

回答

相關問題