Advertisement
Guest User

Untitled

a guest
Dec 7th, 2015
99
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 1.13 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="UTF-8">
  5.         <title>Időkép demo</title>
  6.         <style type="text/css">
  7.         .element {
  8.             background-size: 64px 64px;
  9.             float: left;
  10.         }
  11.         .element div {
  12.             text-align: center;
  13.         }
  14.         </style>
  15.     </head>
  16.     <body>
  17.         <div id="container"></div>
  18.         <script>
  19.         var napokHomerseklete = [10, -20, 5, 8, 12, 22, 45], container = document.getElementById("container"), element, label, image, textNode;
  20.  
  21.         for (var i = 0; i < napokHomerseklete.length; i++) {
  22.             element = document.createElement("div");
  23.             element.className = "element";
  24.             image = document.createElement("img");
  25.             if (napokHomerseklete[i] <= 5) {
  26.                 image.src = "https://cdn0.iconfinder.com/data/icons/good-weather-1/96/weather_icons-68-128.png";
  27.             } else {
  28.                 image.src = "https://cdn0.iconfinder.com/data/icons/good-weather-1/96/weather_icons-01-128.png";
  29.             }
  30.             label = document.createElement("div");
  31.             textNode = document.createTextNode(napokHomerseklete[i]);
  32.             label.appendChild(textNode);
  33.             element.appendChild(label);
  34.             element.appendChild(image);
  35.             container.appendChild(element);
  36.         }
  37.         </script>
  38.     </body>
  39. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement