Tạo Hiệu ứng Hoa Mai Rơi (tuyết Rơi, Lá Rơi,...) Cho Blogspot

Có thể bạn quan tâm

Liên hệ
Dịch vụ
Sitemap
Thơ - Tâm sự
Kiếm tiền online

Home › thu-thuat-blogspot Tạo hiệu ứng hoa mai rơi (tuyết rơi, lá rơi,...) cho Blogspot Hoàng Nhân Khôi 07:43 68 Comments thu-thuat-blogspot SHARE Tweet Edit Tạo hiệu ứng hoa mai rơi cho Blogspot

“Ngày hết tết tới” mỗi năm tết đến xuân về, trong mỗi con người chúng ta, ai cũng có những cảm xúc riêng của mình (thiết nghĩ riêng Tôi thì không “Nỗi buồn cứ u uất bao vây”), cảm nhận được vẻ đẹp của mùa xuân với cây cối đâm chồi nảy lộc, còn gì thú vị hơn khi bạn đem về trên Blog/Website của chính mình. Chính vì lẻ trên, hôm nay mình hướng dẫn các bạn hiệu ứng hoa mai rơi giúp cho blog của bạn trở nên đẹp hơn trong không khí ngày Tết cổ truyền của dân tộc. Ngoài ra các hiệu ứng hoa anh đào rơi, hiệu ứng lá rơi (khi trời chuyển sang thu), hiệu ứng tuyết rơi, hiệu ứng sao rơi,…Thì cũng từ một đoạn Code mà ra thôi. Đọc thêm: ● Tạo hiệu ứng bắn pháo hoa cho Blogspot (Blogger). ● Thêm tiện ích bài viết gần đây đồng thời tạo hiệu ứng (Recent Posts) cho Blogspot. ☼ Giờ bắt đầu thủ thuật cùng Windows2it. Vào Blog => Mẫu => Chỉnh sửa HTML. Nhấn tổ hợp phím Ctrl + F và tìm đến thẻ </head>. Sau đó dán đoạn mã Code sau ở phía trên thẻ </head> và Lưu mẫu. <script type='text/javascript'> //<![CDATA[ var pictureSrc ="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcwRO0rW8JwhCxnaJbIlkhWn4Iskcy9j_W1AvPIghEOM7MsjAtccESZPEohM0gcOQN8m4UP8i3XJ_bdd38Tru1x31ac0U6afKwGOh-aYSMruWBN1RYUJQMTvUTsHqr8mD89u-AVvcV0ug/s1600/hoamai.png"; //the location of the snowflakes var pictureWidth = 15; //the width of the snowflakes var pictureHeight = 15; //the height of the snowflakes var numFlakes = 10; //the number of snowflakes var downSpeed = 0.01; //the falling speed of snowflakes (portion of screen per 100 ms) var lrFlakes = 10; //the speed that the snowflakes should swing from side to sideif( typeof( numFlakes ) != 'number' || Math.round( numFlakes ) != numFlakes || numFlakes < 1 ) { numFlakes = 10; } //draw the snowflakes for( var x = 0; x < numFlakes; x++ ) { if( document.layers ) { //releave NS4 bug document.write('<layer id="snFlkDiv'+x+'"><imgsrc="'+pictureSrc+'" height="'+pictureHeight+'"width="'+pictureWidth+'" alt="*" border="0"></layer>'); } else { document.write('<div style="position:absolute; z-index:9999;"id="snFlkDiv'+x+'"><img src="'+pictureSrc+'"height="'+pictureHeight+'" width="'+pictureWidth+'" alt="*"border="0"></div>'); } } //calculate initial positions (in portions of browser window size) var xcoords = new Array(), ycoords = new Array(), snFlkTemp; for( var x = 0; x < numFlakes; x++ ) { xcoords[x] = ( x + 1 ) / ( numFlakes + 1 ); do { snFlkTemp = Math.round( ( numFlakes - 1 ) * Math.random() ); } while( typeof( ycoords[snFlkTemp] ) == 'number' ); ycoords[snFlkTemp] = x / numFlakes; } //now animate function flakeFall() { if( !getRefToDivNest('snFlkDiv0') ) { return; } var scrWidth = 0, scrHeight = 0, scrollHeight = 0, scrollWidth = 0; //find screen settings forall variations. doing this every time allows for resizing and scrolling if( typeof( window.innerWidth ) == 'number' ) { scrWidth = window.innerWidth; scrHeight = window.innerHeight; } else { if( document.documentElement && (document.documentElement.clientWidth ||document.documentElement.clientHeight ) ) { scrWidth = document.documentElement.clientWidth; scrHeight = document.documentElement.clientHeight; } else { if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) { scrWidth = document.body.clientWidth; scrHeight = document.body.clientHeight; } } } if( typeof( window.pageYOffset ) == 'number' ) { scrollHeight = pageYOffset; scrollWidth = pageXOffset; } else { if( document.body && ( document.body.scrollLeft ||document.body.scrollTop ) ) { scrollHeight = document.body.scrollTop;scrollWidth = document.body.scrollLeft; } else { if(document.documentElement && (document.documentElement.scrollLeft ||document.documentElement.scrollTop ) ) { scrollHeight =document.documentElement.scrollTop; scrollWidth =document.documentElement.scrollLeft; } } } //move the snowflakes to their new position for( var x = 0; x < numFlakes; x++ ) { if( ycoords[x] * scrHeight > scrHeight - pictureHeight ) { ycoords[x] = 0; } var divRef = getRefToDivNest('snFlkDiv'+x); if( !divRef ) { return; } if( divRef.style ) { divRef = divRef.style; } var oPix = document.childNodes ?'px' : 0; divRef.top = ( Math.round( ycoords[x] * scrHeight ) + scrollHeight ) + oPix; divRef.left = ( Math.round( ( ( xcoords[x] * scrWidth ) - (pictureWidth / 2 ) ) + ( ( scrWidth / ( ( numFlakes + 1 ) * 4 ) ) * (Math.sin( lrFlakes * ycoords[x] ) - Math.sin( 3 * lrFlakes * ycoords[x]) ) ) ) + scrollWidth ) + oPix; ycoords[x] += downSpeed; } } //DHTML handlers function getRefToDivNest(divName) { if( document.layers ) { return document.layers[divName]; } //NS4 if( document[divName] ) { return document[divName]; } //NS4 also if( document.getElementById ) { return document.getElementById(divName); } //DOM (IE5+, NS6+, Mozilla0.9+, Opera) if( document.all ) { return document.all[divName]; } //Proprietary DOM - IE4 return false; } window.setInterval('flakeFall();',100); //]]> </script>

☼ Tùy chỉnh. ·Bạn muốn hoa anh đào rơi hay lá rơi hay tuyết rơi hay sao rơi,…Thì các bạn chỉ cần thay đổi hình ảnh này https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcwRO0rW8JwhCxnaJbIlkhWn4Iskcy9j_W1AvPIghEOM7MsjAtccESZPEohM0gcOQN8m4UP8i3XJ_bdd38Tru1x31ac0U6afKwGOh-aYSMruWBN1RYUJQMTvUTsHqr8mD89u-AVvcV0ug/s1600/hoamai.png là xong. ·15 Chiều rộng của bông. ·15 Chiều cao của bông. ·10 Số bông hoa xuất hiện cùng một lúc. ·0,01 Tốc độ rơi của các bông hoa. ·10 Tốc độ các bông hoa giao động từ bên trái sang bên phải và ngược lại. Nếu bạn thích bài viết này, hãy subscribe blog của tôi để thường xuyên cập nhật những bài viết hay nhất, mới nhất qua email nhé. Cảm ơn rất nhiều JJJ Backlink: Xây dựng chiến lược Marketing cho sản phẩm Quá trình cài đặt gặp vấn đề gì cứ để lại Comment !

About Quang Mến :

Tôi là Quang Mến. Tôi viết blog theo phong cách chuyên nghiệp. ^^! Dựa trên niềm đam mê học hỏi và mong muốn chia sẽ với mọi người @@! Theo dõi tôi trên:

THỦ THUẬT LIÊN QUAN

Blogger Comment Facebook Comment

68 nhận xét:

Nặc danhlúc 18:24 5 tháng 2, 2016
rất đẹp... đã áp dụng :)
Trả lờiXóaTrả lời
1. Unknownlúc 05:50 31 tháng 5, 2016
  e ms bc vao nghề ad cho e hỏi . e cop vô sau head thì chỉ làm thế nào ad ? e cop r mà nó k hiển thị .
  XóaTrả lời
2. Unknownlúc 18:49 15 tháng 1, 2018
  có video hướng dẩn thì tốt
  XóaTrả lời
Game Ecchilúc 23:07 6 tháng 2, 2016
Có không khí tết chứ hôm nay giao thừa rồi :)
Trả lờiXóaTrả lời
1. Hoàng Nhân Khôilúc 23:48 6 tháng 2, 2016
  không khí giao thừa tràng ngập rùi mà :) ... Mà bạn sống ở tp HCM à
  XóaTrả lời
2. Game Ecchilúc 18:55 8 tháng 2, 2016
  Không mình ở Vũng Tàu lận
  XóaTrả lời
3. Game Ecchilúc 18:55 8 tháng 2, 2016
  Không mình ở Vũng Tàu lận
  XóaTrả lời
4. Hoàng Nhân Khôilúc 22:38 8 tháng 2, 2016
  ồ... Mình cũng ở Vũng Tàu.. Tự Bác giới thiệu ở Tp HCM mới tưởng Bác sống ở Tp HCM
  XóaTrả lời
5. Game Ecchilúc 19:40 9 tháng 2, 2016
  Giới thiệu là 1 đằng còn sống là một chổ mà với lại code này không cần thêm vào HTML mà thêm vào HTML/Javascrip được mà
  XóaTrả lời
6. Hoàng Nhân Khôilúc 23:26 9 tháng 2, 2016
  Ukm, các thẻ Javascrip, CSS đều chằn được trong HTML/Javascrip .. ngoài trừ các thể meta ....
  XóaTrả lời
7. Game Ecchilúc 23:51 10 tháng 2, 2016
  Bạn chỉ mình chuyển màu nền blog từ màu trắng thành màu khác được không ?
  XóaTrả lời
8. Hoàng Nhân Khôilúc 00:04 11 tháng 2, 2016
  Nếu muốn đổi màu nền cho Blog của bạn tìm đoạn CSS này:#outer-wrapper { background: #fff; thay đổi thành mã màu #fff thành mã màu bạn muốn width: 1170px; text-align: left; font: 12px Arial; margin: 0 auto; padding: 10px; margin-top: 10px;}>>> bảng mã màu đây nhé: https://sites.google.com/site/wwwcaotongvn/css
  XóaTrả lời
9. Game Ecchilúc 01:12 11 tháng 2, 2016
  Cám ơn nhé
  XóaTrả lời
10. Hoàng Nhân Khôilúc 02:14 11 tháng 2, 2016
  :) ___ :)
  XóaTrả lời
11. Game Ecchilúc 21:42 11 tháng 2, 2016
  Lúc nào cũng cười chỉ có thế :)
  XóaTrả lời
12. Game Ecchilúc 21:53 11 tháng 2, 2016
  Mà đổi rồi cũng vậy à có đổi màu đâu ?
  XóaTrả lời
13. Hoàng Nhân Khôilúc 22:06 11 tháng 2, 2016
  Blog nền đang là màu trắng mình thay đổi thành màu đen được rùi nè @! chắc đây là Blog của bạn: www.nguyenhoangngaily.tkhttps://www.facebook.com/photo.php?fbid=688347534640280&set=a.330833443725026.1073741828.100003951181644&type=3&theater>>> Nền Blog chia theo vùng. Nên việc thay màu nền có thể tùy biến nhiều vùng khác nhau .. Cái này Bạn phải biết thêm một tí về CSS là oke ngay (là đẹp ngay)
  XóaTrả lời
14. Game Ecchilúc 23:53 11 tháng 2, 2016
  Mình gửi lời mời kết bạn qua facebook rùi ý mình là cái viền ngoài màu đen còn cái viền trong màu trắng muốn đổi thành màu khác phải làm sao tại mình thấy có blog làm được https://www.facebook.com/photo.php?fbid=212233892459071&set=a.206711303011330.1073741829.100010173843669&type=3&theater
  XóaTrả lời
15. Hoàng Nhân Khôilúc 01:18 12 tháng 2, 2016
  Bạn nên bỏ lệnh chống click chuột phải đi (Đồng nghĩa với chống kiểm tra phần tử)... Chứ đang sữa template để lệnh này khó sữa lắm... >>> Cái viền là viền nào vậy .... nhiều viền quá rối luôn :(
  XóaTrả lời
16. Game Ecchilúc 18:34 12 tháng 2, 2016
  Giờ quên cách xóa rồi mình thấy có người tạo blog giống mình đẹp lắm mà hỏi họ không chỉ :)
  XóaTrả lời
17. Hoàng Nhân Khôilúc 22:31 12 tháng 2, 2016
  Họ ko chỉ thì thui quan trọng gì .... Nếu đã có mẫu rồi thì làm theo thui (tạm gọi là ăn cướp vậy) :)
  XóaTrả lời
18. Game Ecchilúc 23:14 13 tháng 2, 2016
  Biết mà nên mình tự mò đấy @@
  XóaTrả lời
19. Game Ecchilúc 23:15 13 tháng 2, 2016
  Biết mà nên mình tự mò đấy @@
  XóaTrả lời
20. Hoàng Nhân Khôilúc 23:22 13 tháng 2, 2016
  mày mò mãi thế nào cũng thành công thôi :)
  XóaTrả lời
21. Game Ecchilúc 05:36 15 tháng 2, 2016
  Đổi mẫu rồi làm mẫu khác cho dễ rồi nâng lên mấy mẫu khó tí cám ơn bạn đã trợ giúp. Cho mình hỏi làm cái link mà nó đổi màu khi trỏ chuột vào phải sử dụng code nào ?
  XóaTrả lời
22. Hoàng Nhân Khôilúc 07:03 15 tháng 2, 2016
  Đây nhé! một đoạn JS nhỏ: http://codepen.io/quangmen93/pen/RrdpOa?editors=0010
  XóaTrả lời
23. Game Ecchilúc 03:28 17 tháng 2, 2016
  Cám ơn bạn nhé cón nều mình đưa nó vào trong Chỉnh sửa HTML thì phải bỏ nó ở đâu vậy
  XóaTrả lời
24. Hoàng Nhân Khôilúc 03:59 17 tháng 2, 2016
  thêm vào phía trên thẻ đóng head nhé @! :)
  XóaTrả lời
25. Game Ecchilúc 05:51 17 tháng 2, 2016
  Thẻ head nào bạn
  XóaTrả lời
26. Hoàng Nhân Khôilúc 11:47 17 tháng 2, 2016
  bỏ trên thẻ đóng head (thẻ head nó có 1 thẻ đóng 1 thể mở mà bạn)
  XóaTrả lời
27. Game Ecchilúc 04:14 21 tháng 2, 2016
  Bạn cho mình hỏi nếu mua tên miền thì có vĩnh viễn không hay mỗi năm phải đóng thuế vậy bạn
  XóaTrả lời
28. Hoàng Nhân Khôilúc 05:07 21 tháng 2, 2016
  Nếu không có khuyến mãi và nếu bạn mua ở VN thì phí hàng năm là 250.000 ngàn/1 năm ... đối với tên miền .com| .net .... Mua ở nước ngoài thỉ rẻ hơn
  XóaTrả lời
Unknownlúc 07:34 8 tháng 2, 2016
muốn thêm hinh anh hoa đào mai rơi cung 1 lúc giống fshare thì làm sao adhttp://ungdungmaytinhaz.blogspot.com/
Trả lờiXóaTrả lời
1. Hoàng Nhân Khôilúc 22:36 8 tháng 2, 2016
  Muốn giống như fshare bạn dùng Code này nhé : http://codepen.io/anon/pen/OMaOQX
  XóaTrả lời
Unknownlúc 02:33 9 tháng 2, 2016
Minh lam dc roi cam ơn ad nhiềuDemo ungdungmaytinhaz.blogspot.com
Trả lờiXóaTrả lời
1. Hoàng Nhân Khôilúc 03:17 9 tháng 2, 2016
  :)
  XóaTrả lời
2. Unknownlúc 03:45 9 tháng 2, 2016
  hihi ad giúp đở rất nhiệt tình tết ko đi đâu chơi hả ad
  XóaTrả lời
3. Unknownlúc 03:48 9 tháng 2, 2016
  ad ơi blog mình nó có 2 cái main trong bố cục giờ muốn xóa 1 main đi thì làm sao ta
  XóaTrả lời
4. Hoàng Nhân Khôilúc 03:49 9 tháng 2, 2016
  ở nhà tự kỉ ... ăn tết có vui ko bạn
  XóaTrả lời
5. Unknownlúc 04:02 9 tháng 2, 2016
  mình củng giống ad nhà có tang nên mồng 4 mới đi chơi hj
  XóaTrả lời
6. Hoàng Nhân Khôilúc 04:15 9 tháng 2, 2016
  Blog bạn có 1 cột site main và 2 cột sidebar ....
  XóaTrả lời
7. Unknownlúc 04:20 9 tháng 2, 2016
  trong cot site main nó lại có 2 main lun ad ơi lam sao ẩn đi 1 cái main ad ơi
  XóaTrả lời
8. Hoàng Nhân Khôilúc 04:28 9 tháng 2, 2016
  à.... Bạn coi ở phần id="main" nó có 2 id con id="Blog1" và id="Blog2" Bạn Xóa toàn bộ id="Blog2" đi là được à :)
  XóaTrả lời
9. Unknownlúc 05:15 9 tháng 2, 2016
  uk nhỉ delete element la song hi vay ma cung nghĩ ko ra thanks ad :D
  XóaTrả lời
Unknownlúc 06:33 25 tháng 2, 2016
Bạn muốn hoa anh đào rơi hay lá rơi hay tuyết rơi hay sao rơi,…Thì các bạn chỉ cần thay đổi hình ảnh này http://1.bp.blogspot.com/-CXx9jt2JMRk/Vq-Lh5fm88I/AAAAAAAASwo/XivooDn_oSY/s1600/hoamai.png , Hiện tại em không hiểu đoạn này của a viết tai em mới bước vào nghề thôi, bây giờ e muốn tuyết rơi hay sao rơi thì sửa doạn này http://1.bp.blogspot.com/-CXx9jt2JMRk/Vq-Lh5fm88I/AAAAAAAASwo/XivooDn_oSY/s1600/hoamai.png làm sào? nhờ anh chỉ dùm em
Trả lờiXóaTrả lời
1. Hoàng Nhân Khôilúc 06:40 25 tháng 2, 2016
  À đơn giản đoạn Code trên là Hoa mai ... Giờ bạn thích sao rơi: Bạn chỉ cần up hình ảnh lên đâu đó mà tốt nhất là lên Blogspot >>> Tiếp đó bạn lấy link hình ngôi sao bạn vừa up thay cho link này là được http://1.bp.blogspot.com/-CXx9jt2JMRk/Vq-Lh5fm88I/AAAAAAAASwo/XivooDn_oSY/s1600/hoamai.pngChú ý: Tất cả đoạn Code rơi đều tùy biến đoạn code này mà ra :)
  XóaTrả lời
2. Unknownlúc 00:42 22 tháng 12, 2017
  up lên blogspot như thế nào thế
  XóaTrả lời
3. Unknownlúc 00:53 22 tháng 12, 2017
  làm sao để được hình ảnh hoa mai ở 1 trang như ad vậy
  XóaTrả lời
Unknownlúc 21:46 15 tháng 5, 2016
mình có cái blogspot mà chưa làm được, can ho river city
Trả lờiXóaTrả lời
DAVOlúc 00:05 16 tháng 5, 2016
Cảm ơn bạn đã chia sẻ, mình làm được rồi the southern dragon
Trả lờiXóaTrả lời
Nặc danhlúc 09:41 13 tháng 10, 2016
Halloween có hiệu ứng gì không bác. Đang tính làm 1 cái cho trang thể hình của em
Trả lờiXóaTrả lời
Unknownlúc 21:04 31 tháng 12, 2016
sai gắn code lên giao diện bị lỗi bác ơi
Trả lờiXóaTrả lời
1. Hoàng Nhân Khôilúc 06:31 8 tháng 1, 2017
  vớ vấn làm gì lỗi giao diện :(
  XóaTrả lời
soilúc 22:42 4 tháng 1, 2017
Bạn ơi, mình không muốn hiển thị trên giao diện di động thì sao hở bạn?
Trả lờiXóaTrả lời
1. Hoàng Nhân Khôilúc 06:31 8 tháng 1, 2017
  dùng thẻ điều kiện cho mobile là xong :)
  XóaTrả lời
2. Unknownlúc 00:45 22 tháng 12, 2017
  làm sao để dngf thẻ đó ad ơi
  XóaTrả lời
Unknownlúc 15:54 18 tháng 1, 2017
Cám ơn tác giả nhiều. Những bài của tác giả rất hay và chạy rất ổn định
Trả lờiXóaTrả lời
Unknownlúc 01:59 7 tháng 3, 2017
Đẹp nhỉ, ^^ bạn nào cần tham khảo thiết kế văn phòng hay đặt mua Bàn Thờ Treo Tường hay là muốn Thi công nhà đẹp thì ghé thăm nhé ^^
Trả lờiXóaTrả lời
SâU Ma'Y Ti'Nhlúc 16:05 4 tháng 6, 2017
ad có code mưa không,đang nóng quắt người đây :v,e tìm không ra cái ảnh mưa
Trả lờiXóaTrả lời
Unknownlúc 23:02 17 tháng 9, 2017Trả lờiXóaTrả lời
Unknownlúc 19:38 9 tháng 11, 2017
admin ơi có thể cho em xin link ảnh tuyết rơi được không anh. Em kiếm hoài không thấy.
Trả lờiXóaTrả lời
Unknownlúc 01:30 22 tháng 12, 2017
cho xin ảnh tuyết rơi đi
Trả lờiXóaTrả lời
tình ảo trăng saolúc 08:14 26 tháng 6, 2018
mình phải cài đặt đăng nhập ở đâu ( google, cốc cốc....) để có thẻ </heard . rất cảm ơn bạn
Trả lờiXóaTrả lời
tình ảo trăng saolúc 08:19 26 tháng 6, 2018
mình phải cài đặt đăng nhập ở đâu ( google, cốc cốc....) để có thẻ </heard . rất cảm ơn bạn
Trả lờiXóaTrả lời
Đỗ Huylúc 20:12 30 tháng 12, 2019
Cái này tạo widget có được không ad? Hay bắt buộc phải dán thẳng vào code luôn?
Trả lờiXóaTrả lời
dichvuinanhanoilúc 02:18 15 tháng 5, 2020
Cảm ơn bài viết rất chi tiết. Mình cũng xin giới thiệu qua dịch vụ in ấn của inlonggiaVới nhiều năm kinh nghiệm trong lĩnh vực in ấn, là địa chỉ có uy tín tại Hà Nội. Công ty In Long Gia luôn đẩy mạnh phát triển dịch vụ in ấn nhất là mảng sản xuất in hộp cứng cao cấp.Đến với chúng tôi khách hàng sẽ được hỗ trợ tư vấn và thiết kế hoàn toàn miễn phí. Với mục tiêu thỏa mãn mọi nhu cầu của khách hàng. In Long Gia luôn mang đến cho khách hàng những sản phẩm vỏ hộp bìa cứng sang trọng và đẹp mắt nhất.Là xưởng sản xuất trực tiếp không qua trung gian , sử dụng công nghệ máy móc in ấn hiện đại. Giúp bạn tiết kiệm đến 30% chi phí nhưng vẫn đảm bảo chất lượng.
Trả lờiXóaTrả lời
Unknownlúc 01:03 20 tháng 5, 2020
Hay quá. đúng cái đang cần
Trả lờiXóaTrả lời
Đình Trung Teklúc 19:24 20 tháng 12, 2020
tự cài win tự cài windowsquảng cáo online Sản phẩm công nghệ tự động độc quyền của TekDTcài win dễ dàng cài windows dễ dàng
Trả lờiXóaTrả lời