Một số code blogspot đẹp trang trí tết cho Blog/Website 2023
Năm nào cũng vậy, cứ gần tới năm mới là nhiều anh em bắt đầu đi tìm code để trang trí tết cho con Blog thân yêu của mình. Nhân dịp này Thái Phong Pro xin chia sẻ đến các bạn một số code blogspot đẹp để trang trí tết 2023 còn hoạt động rất tốt luôn nhé. Mời các bạn theo dõi bài viết!
 |
| Một số code blogspot đẹp trang trí tết cho Blog/Website 2023 |
Hiệu ứng hoa mai vàng rơi
Hoa mai là một loài hoa đặc trưng của mỗi dịp Tết. Vì thế, nó không thể thiếu trong blog/website của bạn.
Vào Blog -> Chủ đề -> 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ẻ đó.
Demo<script type='text/javascript'>
//<![CDATA[
var pictureSrc ="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhy4LECv1sgdi5Kh5UB3S3dR0Bon5n-HL0HzXC9f0uqYIDDb84EVKy5nCYCGgDkboq0IrnKM60eY2eUle82FA0-eC4e89qFoLQ3mVmWKLAvjrONSr6TiCfZh756-x0RuPW29Jicy8tv4Lg/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 side
if( 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 for all 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>
Một nhánh đào bên trái
Các bạn vào bố cục Blog và chọn vị trí phù hợp sau đó up code lên thôi!
<a style="display:scroll;position:fixed;Top:0px;left:5px;" href="http://www.hanhhuong.info/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHocI2Jeo8vP94n7sdcKxLVl67UZ1HIWrUkEyt2VVM7IKEEUbomvDnVmBIwINr60DSudA8o1vbK_2TrShUChQeuDS4YpM0K_sKoedROl8HM2vKuwnsvnmis00XMi4fhSNOFCsUxZEVk-E/s200/hoadao.png" /></a>
Lưu lại và xem thành quả!
Banner câu đối
Các bạn dán đoạn code bên dưới vào trên thẻ </body> nhé
<style>.tet{display:scroll;position:fixed;top:0px;z-index:999}.tet-left{left:0}.tet-right{right:0}@media (max-width:800px){.tet{display:none}}</style>
<img class='tet tet-left' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg19zbixJWSzq1nD4gDetKGhZ7jzaKhoblNjq4JkD5t_gULojtIxZuBUIglJomrS3I_83SQ__iHCXmOh4IqpuYf3x9MunjeSste2twmhbm9SaTTzOPlLPqmaBgZZb3je9mfx5yEeKz3KDw/s522/caudoitet1.webp'/>
<img class='tet tet-right' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmm0h7Hw5oj3I7wW_pgMgBSEcjgXikMGbF9hPPQOZ1rRYhaq0CNBqSX93fV5Tn3Vdt2FY2XAuZXqT6tkUTYdmIgl25XQNzUhM-vmSDVtpC6As6gP4Ga80LVCk_xmicUXMGYnJU6XZSWFc/s522/caudoitet2.webp'/>
Mai vàng hai bên
Các bạn vào bố cục Blog và chọn vị trí phù hợp sau đó up code lên thôi!
<style>.tet{display:scroll;position:fixed;top:0px;z-index:999}.tet-left{left:0}.tet-right{right:0}@media (max-width:800px){.tet{display:none}}</style>
<img class='tet tet-left' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzGm54bbD6eftUGhYpN7YA9bzsoJT67LVBMVIIKnZnDsjwJvR50L2my_nbkvj7PQR_B7VK7frr1JQxwQs2_xHvaVXCQi9XGe2U7km6BCWSVlQxiVrXXSUAJVngzddA5ZNkNTkOH0RAQk2x/s0/canh-mai-ben-trai.png' style='width:160px;'/>
<img class='tet tet-right' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7gplim7LwtYCtN1VstconPQ6b_9aLkgQreBYECVb1jYrhEmOYT6gCCtoe__7yaLnGd1Gad2V9Um0Mma03Z19cKanz5R-R2q9CF2EZFANaLOqeD-uHjkCaR4xChwwNRZu8UE2Dpg4MDu1v/s0/canh-mai-ben-phai.png' style='width:160px;'/>
Lời Kết
Trên đây hầu như là những code trang trí tết cần thiết và dễ sử dụng nhất cho các Blog/Website rồi đấy. Nếu còn code nào mới lạ trang trí đẹp đừng ngần ngại chia sẻ tại comment bài này nhé, mình sẽ cập nhật lên post luôn.
Và cuối cùng, nhân tiện đây Thái Phong Pro xin chúc anh em một năm mới an khang thịnh vượng, và may mắn nhé ❤️
Copyright © Thái Phong Pro
Đăng nhận xét
image quote pre code