zoukankan      html  css  js  c++  java
  • 一些关于网页标题的动态js特效

    1.当转换页面时,标题改变

    <script>

    document.addEventListener('visibilitychange',function(){

    if(document.visibilityState=='hidden') {

    normal_title=document.title;

    document.title='(づ ̄ 3 ̄)づ';

    }

    else

    document.title=normal_title;

    });

    </script>

    2.标题闪动,你有新的消息

    <script language="JavaScript">

     step=0

     function flash_title()

     {

      step++

      if (step==3) {step=1}         

      if (step==1) {document.title='【你有新的消息】'}

      if (step==2) {document.title='【      】'}

      setTimeout("flash_title()",380);

     }

     flash_title()

    </script>

    也可以尝试浏览器兼容版

    <script language="JavaScript"> 

    setTimeout('flash_title()',2000); //2秒之后调用一次

    function flash_title() 

      //当窗口效果为最小化,或者没焦点状态下才闪动

      if(isMinStatus() || !window.focus)

      {

        newMsgCount();

      }

      else

      {

        document.title='订单管理中心-AOOXING';//窗口没有消息的时候默认的title内容

        window.clearInterval();

      }

    //消息提示

    var flag=false;

    function newMsgCount(){

      if(flag){

        flag=false;

        document.title='【新订单】';

      }else{

        flag=true;

        document.title='【   】';

      }

      window.setTimeout('flash_title(0)',380); 

    }

    //判断窗口是否最小化

    //在Opera中还不能显示

    var isMin = false;

    function isMinStatus() {

      //除了Internet Explorer浏览器,其他主流浏览器均支持Window outerHeight 和outerWidth 属性

      if(window.outerWidth != undefined && window.outerHeight != undefined){

        isMin = window.outerWidth <= 160 && window.outerHeight <= 27;

      }else{

        isMin = window.outerWidth <= 160 && window.outerHeight <= 27;

      }

      //除了Internet Explorer浏览器,其他主流浏览器均支持Window screenY 和screenX 属性

      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>

    3.浏览器标题滚动跑马灯

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>TITLE栏上滚动的文字</title>

    <script language=javascript >

    var text=document.title

    var timerID

    function newtext() {

    clearTimeout(timerID)

    document.title=text.substring(1,text.length)+text.substring(0,1)

    text=document.title.substring(0,text.length)

    timerID = setTimeout("newtext()", 100)

    }

    </script>

    </head>

    <body onload="newtext()"></body>

    </body>

    </html>

    <html>

    <head>

  • 相关阅读:
    JDBC statement的常用方法
    JDBC通过资源文件初始化
    django 常用命令
    pip 设置国内源
    Python中注释与声明
    PyQt5程序基本结构分析
    机器学习中常见的专业术语
    给Linux安装中文的man手册
    Vim:Vim入门级配置
    Linux 目录结构与目录操作
  • 原文地址:https://www.cnblogs.com/HGNET/p/11447877.html
Copyright © 2011-2022 走看看