Простой javascript image randomizer на самом деле не загружает изображения

Question

В настоящее время я работаю над сайтом, где я хочу, чтобы фон в индексе (в данном случае изображение.) Изменялся каждый раз, когда вы входите на сайт. Таким образом, это решение, которое я придумал:

var Index = { 
    Actions: { 
     setBackground: function() { 
      var images = ['1.jpg', '2.jpg', '3.jpg', '4.jpg', '5.jpg']; 
      var random = images[Math.floor(Math.random() * images.length)]; 

      alert(random); 
      $("body").css({'background-image': 'url("../img/backgrounds/' + random + '");'}); 
     } 
    } 
} 
Index.Actions.setBackground(); 

но по какой-то причине фон остается белым. Я также попробовал фактическое переключение следующим образом:

document.body.style.backgroundImage = "../img/backgrounds/" + random; 

Но это тоже ничего не делало. Обратите внимание: пульт пуст.

Вот CSS для объекта тела:

body { 
    background-size:cover; 
    background-position:center; 
    background-attachment:fixed; 
    width:100%; 
    height:100vh; 
    position:relative; 
} 

Есть ли причина, что это не будет работать? И если да, то как это исправить ...

Спасибо.

Answer 1

Попробуйте это; $("body").css('background-image', 'url("../img/backgrounds/' + random + '")'); jsfiddle demo

Исправить синтаксис; .css(propertyName, value)