Fun with JavaScript: Changing Page Titles Dynamically
Have you ever noticed how some websites change their page title when you switch tabs? It's a simple yet clever trick to grab a user's attention. Let’s explore how you can achieve this effect using just a few lines of JavaScript. The Magic Behind visibilitychange The visibilitychange event in JavaScript fires whenever a user switches between tabs or minimizes the browser window. Using this, we can dynamically update the document title based on the tab’s visibility state. Here's the code: document.addEventListener("visibilitychange", function () { if (document.hidden) { document.title = "I'm a lonely tab

Have you ever noticed how some websites change their page title when you switch tabs? It's a simple yet clever trick to grab a user's attention. Let’s explore how you can achieve this effect using just a few lines of JavaScript.
The Magic Behind visibilitychange
The visibilitychange
event in JavaScript fires whenever a user switches between tabs or minimizes the browser window. Using this, we can dynamically update the document title based on the tab’s visibility state.
Here's the code:
document.addEventListener("visibilitychange", function () {
if (document.hidden) {
document.title = "I'm a lonely tab