enable/disable colored snowflakes

This commit is contained in:
MLH
2024-11-26 16:24:56 +01:00
parent a3d8c9d9aa
commit c3500ebce1
2 changed files with 12 additions and 6 deletions

View File

@@ -3,14 +3,14 @@
<div class="snowflakes" aria-hidden="true">
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"> </div>
<div class="snowflake"> </div>
<div class="snowflake"></div>
<div class="snowflake"></div>
<div class="snowflake"></div>
</div>

View File

@@ -1,5 +1,6 @@
const snowflakes = true; // enable/disable snowflakes
const randomSnowflakes = true; // enable random Snowflakes
const enableColoredSnowflakes = true; // enable colored snowflakes on mobile devices
const snowflakeCount = 25; // count of random extra snowflakes
@@ -47,7 +48,8 @@ function addRandomSnowflakes(count) {
console.log('Adding random snowflakes');
const snowflakeSymbols = ['❅', '❆', '❄']; // some snowflake symbols
const snowflakeSymbols = ['❅', '❆']; // some snowflake symbols
const snowflakeSymbolsMobile = ['❅', '❆', '❄']; // some snowflake symbols mobile version
for (let i = 0; i < count; i++) {
// create a new snowflake element
@@ -55,7 +57,11 @@ function addRandomSnowflakes(count) {
snowflake.classList.add('snowflake');
// pick a random snowflake symbol
if (enableColoredSnowflakes) {
snowflake.textContent = snowflakeSymbolsMobile[Math.floor(Math.random() * snowflakeSymbolsMobile.length)];
} else {
snowflake.textContent = snowflakeSymbols[Math.floor(Math.random() * snowflakeSymbols.length)];
}
// set random horizontal position, animation delay and size(uncomment lines to enable)
const randomLeft = Math.random() * 100; // position (0% to 100%)