Last active
June 16, 2022 19:19
-
-
Save mbohanon/def685be086a44b833d37fe0cccf17c9 to your computer and use it in GitHub Desktop.
Animate title text when page tab is not active in browser (onblur), this is NOT a marquee. To see example visit http://SHEmedia.us
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//Here's an eye catching example to get your visitors back when your web page tab is not active within the browser (onblur). This script will animate the original title text with an intro, the original title text is restored when the tab is returned to active state (focus). When the tab is clicked the original page title is restored. For social media sharing it is highly recommended to include the original page title text with the prefaced animated text (onblur). | |
//Created by SHEmedia.us | |
$(function() { | |
var origTitle, animatedTitle, timer; | |
function animateTitle(newTitle) { | |
var currentState = false; | |
origTitle = document.title; // save original title | |
animatedTitle = "Hey There! " + origTitle; | |
timer = setInterval(startAnimation, 2000); | |
function startAnimation() { | |
// animate between the original and the new title | |
document.title = currentState ? origTitle : animatedTitle; | |
currentState = !currentState; | |
} | |
} | |
function restoreTitle() { | |
clearInterval(timer); | |
document.title = origTitle; // restore original title | |
} | |
// Change page title on blur | |
$(window).blur(function() { | |
animateTitle(); | |
}); | |
// Change page title back on focus | |
$(window).focus(function() { | |
restoreTitle(); | |
}); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment