Files
Festive-Seasons-Pro/assets/js/halloween-spiders.js

54 lines
1.7 KiB
JavaScript

(function($) {
// Skript nur ausführen, wenn die body-Klasse 'festive-halloween' vorhanden ist
if (!$('body').hasClass('festive-halloween')) {
return;
}
// Pfad zum Plugin-Verzeichnis wird von PHP übergeben (siehe wp_localize_script)
const pluginUrl = fsp_vars.plugin_url;
function createSpider() {
// Zufällige Spinne auswählen (spider-1.png bis spider-6.png)
const spiderNum = Math.floor(Math.random() * 6) + 1;
// Größe zwischen 50px und 130px
const size = 50 + Math.random() * 80;
// Dauer zwischen 18 und 26 Sekunden
const duration = 18000 + Math.random() * 8000;
// Zufällige Startposition an der Oberkante des Bildschirms
const startX = Math.random() * $(window).width();
// Spinne als jQuery-Objekt erstellen
const $spider = $('<img>')
.attr('src', pluginUrl + 'assets/img/spider-' + spiderNum + '.png')
.css({
position: 'fixed',
width: size + 'px',
top: '-100px',
left: startX + 'px',
zIndex: 9999,
pointerEvents: 'none'
});
$('body').append($spider);
// Animation: Fall nach unten
$spider.animate({
top: $(window).height() + 100
}, {
duration: duration,
easing: 'linear',
complete: function() {
$(this).remove();
}
});
}
// Erste Spinne sofort starten
createSpider();
// Alle 2 Sekunden eine neue Spinne erstellen
setInterval(createSpider, 2000);
})(jQuery);