用Jquery實現打字效果的代碼

wc7n 9年前發布 | 2K 次閱讀 JavaScript jQuery 

    <!DOCTYPE html>

    <html lang="en">

    <head>

        <meta charset="UTF-8">

        <title>Document</title>

        <style type="text/css">



        #container{  
            height: 200px;  
            width: 200px;  
            border: 1px solid #ccc;  
        }  
    </style>  
    <script src="D:\jobn\前端筆記\jquery筆記\jquery-1.11.2.js"></script>  
</head>  
<body>  
    <div id="container">  

    </div>  

    <script type="text/javascript">  
        var con  = $("#container");  
        var s = "這是一個用jquery實現的打字效果";  
        var len = s.length;  
        var index = 0;  
        var tid = null;  

        function start(){  
            con.text('');  
            tid = setInterval(function(){  
                con.append(s.charAt(index));  
                if(index ++ === len){  
                    clearInterval(tid);  
                    index = 0;  
                    start();  
                }  
            },100);  
        }  

        start();  
    </script>  

</body>  
</html>  </pre>
 本文由用戶 wc7n 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！