In cazul in care dorim sa punem anumite decoratiuni pe website-ul nostru de sarbatori va recomand sa folositi unul din scripturile urmatoare.
1. Varianta dinamica
Varianta complexa este formata din 2 portiuni (HTML/CSS) care permit scriptului sa schimbe culorile beculetelor si se vor folosi urmatoarele coduri
CSS - Acest cod se va adauga in fisierul css de style al site-ului
.xmaslights { position: fixed; z-index: 10; top: 0; right: 0; pointer-events: none; width: 522px; height: 233px; background-image: url(https://i.imgur.com/ARJvU9k.png); background-size: contain; background-repeat: no-repeat; background-position: center; animation-name: xmaslights; animation-duration: 0.5s; animation-iteration-count: infinite } @keyframes xmaslights { 0%, 100% { filter: hue-rotate(0deg) } 50% { filter: hue-rotate(45deg) } }
HTML - acest cod se va adauga in fisierul html propriu zis dupa tagul <body>
<div class="xmaslights"></div>
2. Varianta simpla
In cazul in care nu reusiti sa implementati prima varianta, am o solutie mult mai usor de folosit dar care insa nu ofera aspectul dinamic al beculetelor
HTML - Lafel ca si in exemplul de mai sus, codul se adauga intre tag-urile <body>
<img src='https://i.imgur.com/ARJvU9k.png' style="position: absolute; top:2px; right:2px;" /></img>