Viết chữ kiểu đánh máy trên blogspot

 Dưới đây là hiệu ứng nhả từng chữ lên màn hình, giống như kiểu người ta đang đánh máy với thời gian thực.




Code này sử dụng javascript kết hợp với thư viện jquery nhưng không phải toàn bộ các trang của blogspot đều áp dụng thủ thuật này nên bạn chỉ áp dụng vào bài viết hay một tiện ích nào đó mà bạn muốn.

Để thực hiện thủ thuật viết chữ kiểu đánh máy cho blogspot thì không có gì quá phức tạp,bạn chỉ cần sử dụng code tôi sẽ trình bấy dưới đây là được.

Hãy xem thử nhé:


Áp Dụng Vào Blogspot
Bạn sử dụng code bên dưới ngay tại bài viết bên soạn thảo văn bản HTML hay tại tiện ích HTML/javascript ở nơi bạn muốn. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <style> .typewrite{ font-size: 20px;} .typing-cursor{ position: relative; display: inline-block; width: 8px; text-indent: -999em; background: #ccc;} </style> <script> $(document).ready(function(){ //get the content var content = $('.typewrite').html(); //find the length of the content var contentLength = content.length; var char = 0; $('.typewrite').html('<span class="typing-cursor">|</span>'); //Here is the function (function typeFunc() { //dynamic delay to get the typewriting feel var typingSpeed = Math.round(Math.random() * 120) + 60; setTimeout(function() { char++; var type = content.substring(0, char); $('.typewrite').html(type + '<span class="typing-cursor">|</span>'); //recursive typeFunc(); }, typingSpeed); }()); }); </script> <div class="typewrite"> Nội dung bạn cần viết<br/> Nội dung bạn cần viết<br/> </div>

Okay, hi vọng là bài viết này sẽ hữu ích với bạn, chúc các bạn thành công và đừng quên chia sẻ bài viết này đến nơi rộng rãi nha

Post a Comment

Previous Post Next Post