| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Document</title>
- </head>
- <body>
- <main id="main" style="width: max-content;">Светофор для машин</main>
- <script>
- const delay = ms => new Promise(ok => setTimeout(() => ok(ms), ms))
- let divGreen = document.createElement('div')
- let divYelow = document.createElement('div')
- let divRed = document.createElement('div')
- async function trafficLight(domElement,timeGreen,timeYelow,timeRed){
- divGreen.style="background-color: rgb(1, 51, 1) ;"
- divYelow.style="background-color: rgb(105, 111, 1) ;"
- divRed.style="background-color: rgb(97, 2, 2) ;"
- let greenOn =()=> divGreen.style="background-color: rgb(0, 216, 0) ;"
- let greenOf =()=> divGreen.style="background-color: rgb(12, 105, 12) ;"
- let yelowOf =()=> divYelow.style="background-color: rgb(105, 111, 1) ;"
- let yelowOn =()=> divYelow.style="background-color: rgb(202, 216, 0) ;"
- let redOn =()=> divRed.style="background-color: rgb(216, 0, 0) ;"
- let redOf =()=> divRed.style="background-color: rgb(139, 7, 7);"
- divGreen.innerText='Зеленый'
- divYelow.innerText='Желтый'
- divRed.innerText='Красный'
- domElement.append(divGreen,divYelow,divRed)
- while (true){
- yelowOf()
- redOn()
- await delay(timeRed)
- redOf()
- yelowOn()
- await delay(timeYelow)
- yelowOf()
- greenOn()
- await delay(timeGreen)
- greenOf()
- yelowOn()
- await delay(timeYelow)
- }
- }
-
- trafficLight(document.getElementById('main'),5000,1000,5000)
- </script>
- </body>
- </html>
|
