Changing Background Automic using javaScript || time interval function in js javaScript

Design

👇Injoy with source code👇

HTML

CSS

JAVASCRIPT

let boxes = document.getElementsByClassName("box");
console.log(boxes);

function changing() {

for (let index = 0; index < boxes.length; index++) {
        boxes[index].style.backgroundImage = getRandomPic();
    }

function getRandomPic() {

let PicNo = Math.ceil(0 + Math.random() * 9);
        console.log(PicNo);
        if (PicNo == 1) {
            return "url(./pic.jpg)";
        }

if (PicNo == 2) {
            return "url(./pic2.jpg)";
        }
        if (PicNo == 3) {
            return "url(./pic3.jpg)";
        }
        if (PicNo == 4) {
            return "url(./pic4.jpg)";
        }
        if (PicNo == 5) {
            return "url(./pic5.jpg)";
        }
        if (PicNo == 6) {
            return "url(./pic6.jpg)";
        }
        if (PicNo == 7) {
            return "url(./pic7.jpg)";
        }
        if (PicNo == 8) {
            return "url(./pic8.jpg)";
        }
        if (PicNo == 9) {
            return "url(./pic9.jpg)";
        }
    }
}
setInterval(changing, 1000);

For blogger(html,css,js)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Design</title>
    <style>
        * {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

.container01 {
    display: flex;
     /* border: 2px solid red; */
    justify-content: center;
}

.container02 {
    display: flex;
     /* border: 2px solid red; */
    justify-content: center;
}
.container03 {
    display: flex;
    /* border: 2px solid red;*/
    justify-content: center;
}
.box{
    display: flex;
    /* border: 2px solid black; */
    margin: 1px;
    padding: 35px;
    background-size:cover;
}

</style>
</head>
<body>
    <div class="container">
        <div class="container01">
            <div class="box box1"></div>
            <div class="box box2"></div>
            <div class="box box3"></div>
            <div class="box box4"></div>
            <div class="box box5"></div>
        </div>
        <div class="container02">
            <div class="box box6"></div>
            <div class="box box7"></div>
            <div class="box box8"></div>
            <div class="box box9"></div>
            <div class="box box10"></div>
        </div>
        <div class="container03">
            <div class="box box11"></div>
            <div class="box box12"></div>
            <div class="box box13"></div>
        </div>
    </div>

function changing() {

for (let index = 0; index < boxes.length; index++) {
        boxes[index].style.backgroundImage = getRandomPic();
    }

function getRandomPic() {

let PicNo = Math.ceil(0 + Math.random() * 9);
        console.log(PicNo);
        if (PicNo == 1) {
            return "url(./pic.jpg)";
        }

Changing Background Automic using javaScript || time interval function in js javaScript

👇Injoy with source code👇

HTML

CSS

JAVASCRIPT

For blogger(html,css,js)

Fan style name

Footer Menu Widget

Changing Background Automic using javaScript || time interval function in js javaScript

👇Injoy with source code👇

HTML

CSS

JAVASCRIPT

For blogger(html,css,js)

Contact Me

Fan style name

Footer Menu Widget