25 lines
No EOL
871 B
HTML
25 lines
No EOL
871 B
HTML
<music>
|
|
<vertical-marquee id="bg-text"></vertical-marquee>
|
|
<cute-container>
|
|
<img src="/static/assets/gifs/music.gif" alt="Animated text 'Music'" />
|
|
</cute-container>
|
|
</music>
|
|
<script>
|
|
const chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
|
|
const container = document.getElementById('bg-text');
|
|
const colWidth = 20;
|
|
const rowHeight = 24;
|
|
const cols = Math.ceil(window.innerWidth / colWidth);
|
|
const rows = Math.ceil(window.innerHeight / rowHeight);
|
|
|
|
for (let c = 0; c < cols; c++) {
|
|
const col = document.createElement('vertical-marquee-inner');
|
|
col.style.left = (c * colWidth) + 'px';
|
|
for (let r = 0; r < rows; r++) {
|
|
const span = document.createElement('text');
|
|
span.textContent = chars[Math.floor(Math.random() * chars.length)];
|
|
col.appendChild(span);
|
|
}
|
|
container.appendChild(col);
|
|
}
|
|
</script> |