美文网首页
HTML标题实现走马灯的效果

HTML标题实现走马灯的效果

作者: 武汉前端任金杰 | 来源:发表于2020-11-19 19:06 被阅读0次
    q.gif

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>让scroll每隔2000毫秒就执行scroll()一次,从而实现走马灯的效果 </title>
    </head>
    <body>
    <script type="text/javascript">

                function scroll() {  
        
                    //将头文件标题赋值给 tit  
        
                    var tit = document.title;  
        
                    //获取tit的第一个字符  
        
                    var fir = tit.charAt(0);  
        
                    //获取tit剩余的字符  
        
                    var left = tit.substring(1, tit.length)  
        
                    //将头文件标题重新赋值为 (原标题的第二个字符到最后一个字符+原标的的第一个字符)  
        
                    document.title = left + fir;  
        
                }  
        
                //让scroll每隔2000毫秒就执行scroll()一次,从而实现走马灯的效果  
        
                setInterval("scroll()", 500);  
        
            </script>  
    

    </body>
    </html>

    相关文章

      网友评论

          本文标题:HTML标题实现走马灯的效果

          本文链接:https://www.haomeiwen.com/subject/zuvliktx.html