Chia sẻ code trang trí tết 2022 cho website
Bảo Minh Technology chia sẻ các bạn code trang trí website ngày tết cho Blogger , Website . Code trang trí gồm có câu đối đỏ, bánh trưng xanh, hiệu ứng hoa đào rơi trên website…để trang trí Tết 2022 cho Website của bạn chào đón năm mới.
Code tranh trí tết gồm có:
- Hai câu đối trang trí 2 bên left/right cho Website.
- Hiệu ứng hoa đào rơi trên nền web
- Hình ảnh ngày Tết gồm: bánh chưng xanh,dưa hấu,pháo hoa, em bé… ở dưới Bottom website.
Cách thực hiện: Copy đoạn code dưới đây
- Đối với Website thông thường: đặt code dưới thẻ <body> trong Website của bạn
- Đối với WordPress: đặt code dưới thẻ <head> nằm trong file header.php
- Đối với Blogger: chọn Menu →Bố cục→Thêm tiện ích HTML/Javascript
Demo webiste sử dụng code : https://phanmemmaytinh.net/
Code
<style type="text/css">
.tet_left img, .tet_right img {
width: 100%;
height: auto;
}
.tet_left, .tet_right {
position: fixed;
top: 0;
left: 0;
z-index: 99;
width: 191px;
pointer-events: none;
}
.tet_right {
left: auto;
right: 0;
width: 191px;
}
.tet_bottom {
position: fixed;
bottom: 0;
left: 80px;
z-index: 99;
width: 320px;
pointer-events: none;
}
@media (max-width: 1331px){
.tet_left, .tet_right, .tet_bottom{
display: none !important;
}
}
</style>
<div class="tet_left"><img src="/wp-content/uploads/2022/01/left-1.png" alt=""/></div>
<div class="tet_right"><img src="/wp-content/uploads/2022/01/right-1.png" alt=""/></div>
<div class="tet_bottom">
<img src="/wp-content/uploads/2022/01/bottom-1.png" alt=""/>
</div>
<script type="text/javascript">
var no = 20;
if (matchMedia('only screen and (max-width: 767px)').matches) {
no = 10 }
let img_url = 'https://baominh.tech/wp-content/uploads/2022/01/hoadao.png';
var hidesnowtime = 0;
var color_snow = '#fff';
var snowdistance = 'windowheight'; // windowheight or pageheight;
var ie4up = (document.all) ? 1 : 0;
var ns6up = (document.getElementById && !document.all) ? 1 : 0;
function iecompattest() {
return (document.compatMode && document.compatMode != 'BackCompat') ? document.documentElement : document.body
}
var dx, xp, yp;
var am, stx, sty;
var i, doc_width = 800, doc_height = 600;
if (ns6up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight
} else if (ie4up) {
doc_width = iecompattest().clientWidth;
doc_height = iecompattest().clientHeight
}
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
for (i = 0; i < no; ++i) {
dx[i] = 0;
xp[i] = Math.random() * (doc_width - 50);
yp[i] = Math.random() * doc_height;
am[i] = Math.random() * 20;
stx[i] = 0.02 + Math.random() / 10;
sty[i] = 0.7 + Math.random();
if (ie4up || ns6up) {
document.write('<div id="dot'+i+'" style="POSITION:fixed;Z-INDEX:'+(99+i)+';VISIBILITY:visible;TOP:15px;LEFT:15px;pointer-events: none;width:15px"><span style="font-size:18px;color:'+color_snow+'"><img src="'+img_url+'" alt=""></span></div>');
}
}
function snowIE_NS6() {
doc_width = ns6up ? window.innerWidth - 10 : iecompattest().clientWidth - 10;
doc_height = (window.innerHeight && snowdistance == 'windowheight') ? window.innerHeight : (ie4up && snowdistance == 'windowheight') ? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance == 'pageheight') ? iecompattest().scrollHeight : iecompattest().offsetHeight;
for (i = 0; i < no; ++i) {
yp[i] += sty[i];
if (yp[i] > doc_height - 50) {
xp[i] = Math.random() * (doc_width - am[i] - 30);
yp[i] = 0;
stx[i] = 0.02 + Math.random() / 10;
sty[i] = 0.7 + Math.random()
}
dx[i] += stx[i];
document.getElementById('dot' + i).style.top = yp[i] + 'px';
document.getElementById('dot' + i).style.left = xp[i] + am[i] * Math.sin(dx[i]) + 'px'
}
snowtimer = setTimeout('snowIE_NS6()', 10)
}
function hidesnow() {
if (window.snowtimer) {
clearTimeout(snowtimer)
}
for (i = 0; i < no; i++) document.getElementById('dot' + i).style.visibility = 'hidden'
}
if (ie4up || ns6up) {
snowIE_NS6();
if (hidesnowtime > 0) setTimeout('hidesnow()', hidesnowtime * 1000)
}
</script>
Hoặc bạn có thể tải file txt của đoạn code trên tại đây
- Link Mediafire : https://download.baominh.tech/yQaI3gj
- Link TeleDrive : https://download.baominh.tech/uSqCID
