User:Editingthingsforlife/vector-2022.js
Appearance
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
// Eerie JavaScript effects for Descent Wiki
$(document).ready(function() {
// 1. Background Flicker
const backgroundContainer = $('#mw-content-text');
if (backgroundContainer.length) {
setInterval(function() {
backgroundContainer.css('opacity', Math.random() * 0.1 + 0.9); // Flicker between 0.9 and 1 opacity
}, 4000 + Math.random() * 3000); // Flicker every 4-7 seconds
}
// 2. Glitchy Hover on Sidebar Links
const sidebarLinks = $('.vector-menu-portal .vector-menu-content li a');
sidebarLinks.each(function() {
$(this).on('mouseover', function() {
$(this).css({
'transform': 'translateX(' + (Math.random() * 5 - 2.5) + 'px)', // Random horizontal glitch
'filter': 'brightness(0.7)' // Dim on hover
});
}).on('mouseout', function() {
$(this).css({
'transform': 'translateX(0)',
'filter': 'brightness(1)'
});
});
});
// 3. Delayed Fade-In for Welcome Message
const welcomeMessage = $('.mw-parser-output p');
welcomeMessage.css('opacity', 0); // Start hidden
setTimeout(function() {
welcomeMessage.animate({ opacity: 1 }, 2500); // Fade in over 2.5 seconds
}, 1500); // Delay by 1.5 seconds
});