Difference between revisions of "MediaWiki:Nookipedia-timeless.js"
From Nookipedia, the Animal Crossing wiki
(Fine, we'll do it the boring way) |
SuperHamster (talk | contribs) (Controlling text logo visibility via opacity+visibility instead of display) |
||
Line 10: | Line 10: | ||
if ($(window).width() > 1099) { | if ($(window).width() > 1099) { | ||
if ($(window).scrollTop() > 130) { | if ($(window).scrollTop() > 130) { | ||
− | $('#p-logo-text'). | + | if ($('#p-logo-text').css('opacity') == 0) { |
+ | $('#p-logo-text').css('visibility', 'visible'); | ||
+ | $('#p-logo-text').animate({ opacity: 1 }, 250); | ||
+ | } | ||
} else { | } else { | ||
− | $('#p-logo-text'). | + | if ($('#p-logo-text').css('opacity') == 1) { |
+ | $('#p-logo-text').css('visibility', 'hidden'); | ||
+ | $('#p-logo-text').animate({ opacity: 0 }, 250); | ||
+ | } | ||
} | } | ||
} else { | } else { | ||
− | $('#p-logo-text'). | + | if ($('#p-logo-text').css('opacity') == 0) { |
+ | $('#p-logo-text').css('visibility', 'visible'); | ||
+ | $('#p-logo-text').animate({ opacity: 1 }, 250); | ||
+ | } | ||
} | } | ||
} | } |
Revision as of 02:51, June 5, 2021
/* Any JavaScript here will be loaded for users using the Timeless skin */
/*
JavaScript for Timeless is also loaded from the following gadgets:
MediaWiki:Gadget-CollapsibleNav.js
*/
$(document).ready(function() {
/* On desktop, display text logo once user scrolls down */
function toggleTextLogo() {
if ($(window).width() > 1099) {
if ($(window).scrollTop() > 130) {
if ($('#p-logo-text').css('opacity') == 0) {
$('#p-logo-text').css('visibility', 'visible');
$('#p-logo-text').animate({ opacity: 1 }, 250);
}
} else {
if ($('#p-logo-text').css('opacity') == 1) {
$('#p-logo-text').css('visibility', 'hidden');
$('#p-logo-text').animate({ opacity: 0 }, 250);
}
}
} else {
if ($('#p-logo-text').css('opacity') == 0) {
$('#p-logo-text').css('visibility', 'visible');
$('#p-logo-text').animate({ opacity: 1 }, 250);
}
}
}
$(window).scroll(toggleTextLogo);
$(window).resize(toggleTextLogo);
/* Open Social links in new tab/window */
$( '#n-Discord' ).find( 'a' ).attr( 'target' , '_blank' );
$( '#n-Twitter' ).find( 'a' ).attr( 'target' , '_blank' );
$( '#n-Instagram' ).find( 'a' ).attr( 'target' , '_blank' );
$( '#n-Facebook' ).find( 'a' ).attr( 'target' , '_blank' );
});