Показать сообщение отдельно
  #1 (permalink)  
Старый 16.07.2016, 15:45
Аватар для Black_Star
Профессор
Отправить личное сообщение для Black_Star Посмотреть профиль Найти все сообщения от Black_Star
 
Регистрация: 11.07.2016
Сообщений: 300

Вставка картинок из папки с задержкой по времени.
Добрый день. Вот какая идея - сделать вставку картинок из папки. с задержкой по времени. Каждая новая картинка будет появляться на месте прошлой.

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Picture</title>
    <style type="text/css">
    #box {
        position: relative;
        width: 500px;
        height: 300px;
        background-color: green;
        color: white;
    }
    
    #textBox {
        float: right;
        background-color: red;
        color: white;
        font-size: 1.2em;
        height: 100px;
        width: 200px;
    }
    </style>
</head>

<body>
    <div id="box">
        <div id="pictureBox"></div>
        <div id="textBox"></div>
    </div>
    <script type="text/javascript">
    var div = document.getElementById('box');
    var textBox = document.getElementById('textBox');


    textBox.innerHTML = "<strong>Ура!</strong> Вы прочитали это важное сообщение.";


    function pictureBox() {
        var parentEl = document.getElementById("pictureBox"),
            img = document.createElement("IMG");

        img.src = "pic/1.jpg";
        img.width = "150";
        img.height = "150";

        parentEl.appendChild(img);

    }

    var Timer = setTimeout(pictureBox, 3000);

    console.log("Vse OK");
    </script>
</body>

</html>


Подскажите пожалуйста, как реализовать? Я так понимаю, что картинки надо поместить в некий массив, по которому будет ити бесконечный цикл зависящий от задержки во времени ?

Последний раз редактировалось Black_Star, 16.07.2016 в 15:48.
Ответить с цитированием