| 2022-01-12 09:35:03 EU-PIXEL ART Code Week 2 Kodiranje i programiranje važne su kompetencije koje će otvoriti nove mogućnosti našim učenicima. Učenje programiranja pomaže nam da shvatimo svijet oko sebe koji se brzo mijenja, proširimo svoje razumijevanje o tome kako funkcionira tehnologija te da razvijemo vještine i sposobnosti kako bismo istraživali nove ideje i bili inovativni. Osnovna digitalna pismenost svake osobe u digitalnom dobu treba uključivati razumijevanje programiranja i razvoj ključnih kompetencija povezanih s računalnim razmišljanjem, kao što su rješavanje problema, suradnja i analitičke vještine. Europski tjedan programiranja društvena je inicijativa čiji je cilj na zabavan način svima približiti programiranje i digitalnu pismenost. Ove se godine CodeWeek održavao od 9. do 24. listopada 2021. Europskom tjednu programiranja pridružili su se i učenici 5. b i 5. c razreda OŠ Pavla Belasa. Prijavili su svoje aktivnosti na stranicu CodeWeek te se pridružili i eTwinnning projektu EU CODE WEEK – PIXELART 2. Cilj projekta je potaknuti učenike na jednostavan pristup kodiranju pomoću PixelArt tehnike. U tehnici Pixelarta učenici su izradili na papiru i pomoću alata PixelArt likove životinja, članova obitelji, zastava, glagoljičnih slova… Ivanka Tomić, profesorica hrvatskoga jezika #hcg-slider-1 .hcg-slide-container { width: 550px; height: auto; } .hcg-slider { text-align: center; font-family: Arial, Helvetica, sans-serif; } .hcg-slide-container { max-width: 100%; display: inline-block; position: relative; } .hcg-slides { display: none; text-align: center; overflow: hidden; } .hcg-slides img { max-width: 100%; max-height: 100%; display: inline-block; border-radius: 5px; border: solid 1px #a0a0a0; vertical-align: middle; } .hcg-slide-prev, .hcg-slide-next { cursor: pointer; position: absolute; top: 50%; width: auto; padding: 16px; margin-top: -22px; color: #fff; font-weight: bold; font-size: 18px; transition: 0.6s ease; border-radius: 0 3px 3px 0; text-decoration: none; } .hcg-slide-next { right: 0; border-radius: 3px 0 0 3px; } .hcg-slide-prev { left: 0; border-radius: 0 3px 3px 0; } .hcg-slide-prev:hover, .hcg-slide-next:hover { background-color: #000c; } .hcg-slide-dot-control { margin-top: 10px; text-align: center; } .hcg-slide-dot { cursor: pointer; height: 13px; width: 13px; margin: 0 2px; background-color: #bbb; border-radius: 50%; display: inline-block; } .hcg-slide-dot.dot-active { background-color: #717171; } .hcg-slide-number { color: #ffffff; font-size: 12px; padding: 4px 7px; position: absolute; border-radius: 5px; top: 5px; left: 5px; background-color: rgba(255,255,255,0.30); } /************CSS Animation***********/ .animated { animation-name: fadeIn; animation-duration: 1s; } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .fadeIn { animation-name: fadeIn; } 1/5 ❮ ❯ (function(){ //If you want to include more images, add the link name and URL of the image in the array list below. let images_list = [ {"url":"https://html-generator.com/uploads/images/2022/01/12/25395UTIUBLBBPD.jpg","name":"25395UTIUBLBBPD.jpg","link":""}, {"url":"https://html-generator.com/uploads/images/2022/01/12/258578LAKU500RQ.jpg","name":"258578LAKU500RQ.jpg","link":""}, {"url":"https://html-generator.com/uploads/images/2022/01/12/26272CU8WM1Z6KO.jpg","name":"26272CU8WM1Z6KO.jpg","link":""}, {"url":"https://html-generator.com/uploads/images/2022/01/12/26738LQEN30I9ZM.jpg","name":"26738LQEN30I9ZM.jpg","link":""}, {"url":"https://html-generator.com/uploads/images/2022/01/12/27191PKVWWQ01D_.jpg","name":"27191PKVWWQ01D_.jpg","link":""}, {"url":"https://html-generator.com/uploads/images/2022/01/12/276134AUYLTXAHQ.jpg","name":"276134AUYLTXAHQ.jpg","link":""}, {"url":"https://html-generator.com/uploads/images/2022/01/12/280503XZ_VL4830.jpg","name":"280503XZ_VL4830.jpg","link":""} ]; let slider_id = document.querySelector("#hcg-slider-1"); // append all images let dots_div = ""; let images_div = ""; for (let i = 0; i < images_list.length; i++) { // if no link without href="" tag let href = (images_list[i].link == "" ? "":' href="'+images_list[i].link+'"'); images_div += ''+ ''+(i+1)+'/'+images_list.length+''+ ''+ ''; dots_div += ''; } slider_id.querySelector(".hcg-slider-body").innerHTML = images_div; slider_id.querySelector(".hcg-slide-dot-control").innerHTML = dots_div; let slide_index = 0; let images = slider_id.querySelectorAll(".hcg-slides"); let dots = slider_id.querySelectorAll(".hcg-slide-dot"); let prev_button = slider_id.querySelector(".hcg-slide-prev"); let next_button = slider_id.querySelector(".hcg-slide-next"); function showSlides() { if (slide_index > images.length-1) { slide_index = 0; } if (slide_index < 0) { slide_index = images.length-1; } for (let i = 0; i < images.length; i++) { images[i].style.display = "none"; dots[i].classList.remove("dot-active"); if (i == slide_index) { images[i].style.display = "block"; dots[i].classList.add("dot-active"); } } } prev_button.addEventListener("click", function(event) { event.preventDefault(); slide_index--; showSlides(); }, false); next_button.addEventListener("click", function(event){ event.preventDefault(); slide_index++; showSlides(); }, false); function dot_click(event) { slide_index = event.target.dataset.id; showSlides(); } for (let i = 0; i < dots.length; i++) { dots[i].addEventListener("click", dot_click, false); } })(); |
| Osnovna škola Pavao Belas |