JS implementation of flashing title message reminder effect
- 2020-03-30 03:24:44
- OfStack
Sometimes we need to remind the user that there is a new message, which can be implemented using the following method.
The effect is the flashing effect of "[]" and "new message" in the title bar of the page window when the page window does not get focus and is minimized.
<script language="JavaScript">
setTimeout('flash_title()',2000); //Call it after 2 seconds
function flash_title()
{
//Only flashes when the window effect is minimized or has no focus
if(isMinStatus() || !window.focus)
{
newMsgCount();
}
else
{
document.title=' Order management center -AOOXING';//The default title content when the window has no message
window.clearInterval();
}
}
//Message prompt
var flag=false;
function newMsgCount(){
if(flag){
flag=false;
document.title=' New order ';
}else{
flag=true;
document.title=' 【 】 ';
}
window.setTimeout('flash_title(0)',380);
}
//Determines whether the window is minimized
//It doesn't show up in Opera yet
var isMin = false;
function isMinStatus() {
//Other than Internet Explorer, all major browsers support the Window outerHeight and outerWidth properties
if(window.outerWidth != undefined && window.outerHeight != undefined){
isMin = window.outerWidth <= 160 && window.outerHeight <= 27;
}else{
isMin = window.outerWidth <= 160 && window.outerHeight <= 27;
}
//With the exception of Internet Explorer, all major browsers support the Window screenY and screenX properties
if(window.screenY != undefined && window.screenX != undefined ){
isMin = window.screenY < -30000 && window.screenX < -30000;//FF Chrome
}else{
isMin = window.screenTop < -30000 && window.screenLeft < -30000;//IE
}
return isMin;
}
</script>