Форум

shmihshmih · #1 (**permalink**) 09.05.2015, 14:42

Привет! Подскажите пожалуйста почему не работает скрипт?

var imagesi = [red,green,black,yellow,fuchsia];
var slider = document.getElementById("slider");
var innerslider = slider.style.bgColor;
for (var i = 0; i < imagesi.length; i++) {
function anon(step) {
var step;
step = imagesi[i];
return step;};}
function sliding() {
innerslider.step;
}
setInterval(sliding,1000);

Есть див #slider. Каждую секунду должен меняться цвет фона, а он не меняется. Подскажите как исправить?

Vlasenko Fedor · #2 (**permalink**) 09.05.2015, 15:45

<style>#slider{width: 100px; height: 100px;}</style>
<body>
<div id="slider"></div>
<script>
window.onload = function () {
    var obj = {
        __colors: [],
        __position: 0,
        get color() {
            if (this.__position == this.__colors.length) this.__position = 0;
            return this.__colors[this.__position++];
        },
        set color(arg) {
            this.__colors = arg;
        }
    };
    obj.color = ['red', 'green', 'black', 'yellow', 'fuchsia'];
    setInterval(function () {
        document.getElementById('slider').style.backgroundColor = obj.color;
    }, 1000);
};
</script>
</body>

вариант

Decode · #3 (**permalink**) 09.05.2015, 15:58

Вариант №2

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title></title>
  <style>
    #slider {
      width: 100px;
      height: 100px;
    }

    .color1 {
      background-color: red;
    }

    .color2 {
      background-color: green;
    }

    .color3 {
      background-color: black;
    }

    .color4 {
      background-color: yellow;
    }

    .color5 {
      background-color: fuchsia;
    }
  </style>
</head>
<body>
  <div id="slider"></div>
  
  <script>
    (function changeColor(currentNumber){
      currentNumber++;

      if(currentNumber >5){
        currentNumber = 1;
      }

      document.getElementById('slider').setAttribute('class', 'color' + currentNumber);

      setTimeout(function(){
        changeColor(currentNumber)
      }, 1000); 
    })(0);
  </script>
</body>
</html>

Magneto · #4 (**permalink**) 10.05.2015, 17:35

Или:

<html><head></head><body><script type="text/javascript">

var getNum = function() {return Math.floor(Math.random() * 256)};

setInterval(function() {
	document.body.style.backgroundColor = 'rgb(' + getNum() + ',' + getNum() + ',' + getNum() + ')';
}, 1000);

</script></body></html>

shmihshmih · #5 (**permalink**) 11.05.2015, 12:42

Спасибо)

LADYX · #6 (**permalink**) 22.02.2020, 18:10

Сообщение от Magneto

Или:

а если нужно не для body, а для какого-то блока (.block), то как правильно написать вместо "document.body"?

рони · #7 (**permalink**) 22.02.2020, 18:18

Сообщение от LADYX

то как правильно написать

querySelector

LADYX · #8 (**permalink**) 22.02.2020, 18:23

рони,

прошу прощения, что-то я сам ступил))

Сообщение от LADYX

как правильно написать вместо "document.body"?

Отвечаю сам же на свой вопрос:

вместо:

document.body

пишем:

document.body.appendChild(block)

и добавляем:

var block = document.createElement('block');

всё же верно?

рони · #9 (**permalink**) 22.02.2020, 18:26

Сообщение от LADYX

всё же верно?

вам виднее, иначе пишите код полностью.

LADYX · #10 (**permalink**) 22.02.2020, 18:33

Сообщение от рони

вам виднее, иначе пишите код полностью.

рони,
да-да, всё работает, не буду вас лишний раз напрягать по таким глупым пустякам)) Прошу прощения

Форум

Справочник

Discord чат

Курсы javascript