Note Thông báo: Từ ngày 25/05/2021 hệ thống ngừng hoạt động, mọi vấn đề hay thắc mắc trên đây sẽ không được giải quyết. Hãy truy cập Code Pro để được hỗ trợ!

SHARE CODE HIỆU ỨNG TUYẾT RƠI CHO BLOG, WEBSITE ĐÓN GIÁNG SINH

Loading...

TẢN MẠN

Hello, Chào mừng tất cả các bạn đã đến với bài viết tiếp theo của mình ! Do bận đi học, đi làm nên lâu lâu mới có thời gian viết bài cho các bạn được :) Sáng nay được nghỉ để chiều đi thi mà chẳng biết ôn gì nên lên đây viết bài chia sẻ, tâm sự xíu cho đỡ buồn. Không linh tinh luyên thuyên nữa thì chúng ta bắt đầu nào =))

Như tiêu đề đã nói, hôm nay mình sẽ chia sẻ cho các bạn một đoạn code hiệu ứng tuyết rơi tuyệt đẹp !!! Sắp Noel rồi đó, các bạn tranh thủ lấy về trang trí cho blog nó nhộn nhịp đi nào :) Và mình cũng nói luôn, code này không phải do mình viết hay chia sẻ lại từ blog nào :) mà mình vọc (mạn phép lấy trộm) được bên Ảnh Bìa Chất . Nếu bạn nào có ý kiến về bản quyền hãy nhanh trí để lại một comment =)) Mình sẽ xóa ngay nếu hợp lý :)

HƯỚNG DẪN THỰC HÀNH

BƯỚC 1:

Các bạn nhanh trí Copy đoạn code bên dưới nha =))
<style>
#snowflakeContainer{position:absolute;left:0px;top:0px;}
.snowflake{padding-left:15px;font-size:14px;line-height:24px;position:fixed;color: #FFFFFF;user-select:none;z-index:1000;-moz-user-select:none;-ms-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;}
.snowflake:hover {cursor:default}
</style>
<div id='snowflakeContainer'>
<p class='snowflake'>&#8226;</p>
</div>
<script style='text/javascript'>//<![CDATA[
var requestAnimationFrame=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.msRequestAnimationFrame;var transforms=["transform","msTransform","webkitTransform","mozTransform","oTransform"];var transformProperty=getSupportedPropertyName(transforms);var snowflakes=[];var browserWidth;var browserHeight;var numberOfSnowflakes=50;var resetPosition=false;function setup(){window.addEventListener("DOMContentLoaded",generateSnowflakes,false);window.addEventListener("resize",setResetFlag,false)}setup();function getSupportedPropertyName(b){for(var a=0;a<b.length;a++){if(typeof document.body.style[b[a]]!="undefined"){return b[a]}}return null}function Snowflake(b,a,d,e,c){this.element=b;this.radius=a;this.speed=d;this.xPos=e;this.yPos=c;this.counter=0;this.sign=Math.random()<0.5?1:-1;this.element.style.opacity=0.5+Math.random();this.element.style.fontSize=4+Math.random()*20+"px"}Snowflake.prototype.update=function(){this.counter+=this.speed/5000;this.xPos+=this.sign*this.speed*Math.cos(this.counter)/40;this.yPos+=Math.sin(this.counter)/40+this.speed/30;setTranslate3DTransform(this.element,Math.round(this.xPos),Math.round(this.yPos));if(this.yPos>browserHeight){this.yPos=-50}};function setTranslate3DTransform(a,c,b){var d="translate3d("+c+"px, "+b+"px, 0)";a.style[transformProperty]=d}function generateSnowflakes(){var b=document.querySelector(".snowflake");var h=b.parentNode;browserWidth=document.documentElement.clientWidth;browserHeight=document.documentElement.clientHeight;for(var d=0;d<numberOfSnowflakes;d++){var j=b.cloneNode(true);h.appendChild(j);var e=getPosition(50,browserWidth);var a=getPosition(50,browserHeight);var c=5+Math.random()*40;var g=4+Math.random()*10;var f=new Snowflake(j,g,c,e,a);snowflakes.push(f)}h.removeChild(b);moveSnowflakes()}function moveSnowflakes(){for(var b=0;b<snowflakes.length;b++){var a=snowflakes[b];a.update()}if(resetPosition){browserWidth=document.documentElement.clientWidth;browserHeight=document.documentElement.clientHeight;for(var b=0;b<snowflakes.length;b++){var a=snowflakes[b];a.xPos=getPosition(50,browserWidth);a.yPos=getPosition(50,browserHeight)}resetPosition=false}requestAnimationFrame(moveSnowflakes)}function getPosition(b,a){return Math.round(-1*b+Math.random()*(a+2*b))}function setResetFlag(a){resetPosition=true};
//]]></script>

BƯỚC 2:

Tiếp tục nhanh trí Paste đoạn code trên vào ngay trước thẻ đóng </boby> của blog =))

BƯỚC 3:

Lưu chủ để và tận hưởng thành quả !!!

LỜI KẾT

Nếu thấy bài viết hay thì đừng quên nhấn share và click quảng cáo để ủng hộ mình nha !!!
Chúc các bạn một ngày học tập và làm việc thật hiệu quả !!!
  1. chết chết ảnh ai kia mà xinh zữ vậy anh ơi :*

    Trả lờiXóa
  2. thú vị nha :p haha chúc a buổi tối vv <3

    Trả lờiXóa
  3. Trả lời
    1. ui đen thế....em gửi lại đi...nghe nói nếu gửi lại 2-3 lần mà vẫn ko được là nó sẽ cho mình xác minh bằng giấy tờ up lên đó...thế nên là cứ yên tâm :D google nó ko lừa đảo đâu :D

      Xóa
  4. Trả lời
    1. @Hoàng Thành sao nãy em load lại bị mất bài này thế :v

      Xóa
    2. có chút vấn đề bản quyền :)...giải quyết xong rồi :D

      Xóa
    3. không xinh bằng Trinh nè <3

      Xóa
    4. thì ah có bảo xinh đâu :( Trinh thì xinh rồi :(

      Xóa
    5. Nào đã có ai yêu :D Còn đang sợ ế đây này <3

      Xóa
    6. Vậy ny Đức rồi (y) không Đức thì Thắng :D Biết thừa :3

      Xóa
    7. Ảnh mạng bố ạ :( lom dom

      Xóa
    8. @Lâm Nông Quý biết ai ở đây không ? Nói cư như thật ý :)

      Xóa
    9. úi trời ảnh mạng thì bản quyền là đúng rồi :D

      Xóa
    10. bản quyền nội dung ông ạ :) ảnh thì ko sao :v

      Xóa
    11. hôm nào up ảnh bé Trinh đi Thành ơi :D

      Xóa
    12. Noel sẽ có event nhé :D lúc ý kiểu gì chẳng có yên tâm :*

      Xóa
    13. Thử xem :) đừng có mà nch :)

      Xóa
    14. căng đét :D :D :D :D :D :D

      Xóa
    15. thôi đi tắm (y) xàm với ông có mà hết buổi =))

      Xóa
    16. dạo này lười viết bài quá nha =)) toàn bài cũ ko à :(

      Xóa
    17. hay để tôi add ông làm ctv rồi cho ông viết bài :)) viết bài phải có hứng chứ :( cạn lời để viết luôn rồi <3

      Xóa
    18. ngủ thôi mấy cậu ơi <3 Hà Nội lạnh lắm rồi :((

      Xóa
  5. giảm QC đi e eey :)) QC trên blog để v chậm blog tiền nó cũng không nhảy đồng nào đâu, lượt click quyết định mà

    Trả lờiXóa