The Issue
When you’re logged in and view the home page of the website, the logo behaves correctly. Correct behavior is that it will animate and then end showing “The Stable”. When you scroll down (jquery waypoint), a second animation happens that fades the logo letters out, and displays only the A until you scroll back up.
When you’re logged out and view the site, both animations run immediately.
You can see what I mean by logging in and viewing the site/logo, then viewing the site not logged in (or incogneto mode):
Username: TemporaryTester
Password: T3mpT3str!
What’s Been Done
All plugins have been disabled
The cache has been flushed and disabled
The HTACCESS has been reverted to default
Do you see anything, or know of anything that might be causing such an oddity?
So immediate impulse: When logged in, there’s a black bar across the top for your logged-in state. So chances are your trigger for the logo is right at that border, and when you’re not logged in, you’re far enough ‘down’ the page that it’s firing.
Ah, interesting idea. I double checked that and there what I’m targeting is the which is available on both the logged in and logged out version.
Here’s the specific call for the code if you wanted to investigate whether I miff’d something here (note it uses Waypoint.js).
jQuery(function($){
// SMOOTH OUT TRANSITION - STABLE LOGO
$('.qodef-page-header').waypoint(function(direction) {
// Target this element and run the up or down animation respectively
if (direction === 'down') {
$(".fadeMe").addClass("blur-in-fwd");
$(".fadeMe").removeClass("blur-in-bkw");
$("#smooth-logo").addClass("slideLeft");
$("#smooth-logo").removeClass("slideRight");
$("#animOut").get(0).beginElement(); // restart the animation
} else if (direction === 'up') {
$(".fadeMe").addClass("blur-in-bkw");
$(".fadeMe").removeClass("blur-in-fwd slide-right");
$("#smooth-logo").addClass("slideRight");
$("#smooth-logo").removeClass("slideLeft");
$("#animIn").get(0).beginElement(); // restart the animation
}
},
{ offset: "20%" })
});
