 |
| Cách thêm hiệu ứng trái tim khi nhấp chuột cho Blogspot |
Chào các bạn lại là mình đây, hôm nay mình thấy một code khá hay sẽ giúp các bạn trang trí blog. Cái này chỉ hiển thị khi dùng máy tính thôi nha, khi nhấp chuột vào một nơi bất kỳ trong blog thì sẽ hiện ra một hàng trái tim đủ 7 sắc cầu vồng. Trước khi vào bài viết mình xin 5s ấn vào cái chuông để đón nhận những bài viết mới nhất nhé!
Cách thêm hiệu ứng trái tim khi nhấp chuột cho Blogspot
Bước 1: Truy cập vào blogger
Bước 2: Chọn Chủ đề ➤ Chỉnh sửa HTML ➤ Nhấn Ctrl + F tìm đến </body>
Bước 3: Dán đoạn javascript vào trước </body>
<script type='text/javascript'>
//<![CDATA[
!function(e,t,a){function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"),o(),r()}function r(){for(var e=0;e<d.length;e++)d[e].alpha<=0?(t.body.removeChild(d[e].el),d.splice(e,1)):(d[e].y--,d[e].scale+=.004,d[e].alpha-=.013,d[e].el.style.cssText="left:"+d[e].x+"px;top:"+d[e].y+"px;opacity:"+d[e].alpha+";transform:scale("+d[e].scale+","+d[e].scale+") rotate(45deg);background:"+d[e].color+";z-index:99999");requestAnimationFrame(r)}function o(){var t="function"==typeof e.onclick&&e.onclick;e.onclick=function(e){t&&t(),i(e)}}function i(e){var a=t.createElement("div");a.className="heart",d.push({el:a,x:e.clientX-5,y:e.clientY-5,scale:1,alpha:1,color:s()}),t.body.appendChild(a)}function c(e){var a=t.createElement("style");a.type="text/css";try{a.appendChild(t.createTextNode(e))}catch(t){a.styleSheet.cssText=e}t.getElementsByTagName("head")[0].appendChild(a)}function s(){return"rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"}var d=[];e.requestAnimationFrame=function(){return e.requestAnimationFrame||e.webkitRequestAnimationFrame||e.mozRequestAnimationFrame||e.oRequestAnimationFrame||e.msRequestAnimationFrame||function(e){setTimeout(e,1e3/60)}}(),n()}(window,document);
//]]>
</script>Bước 4: Nhấn Lưu!
Lời Kết
Trên đây là toàn bộ cách thêm hiệu ứng trái tim khi nhấp chuột cho Blogspot và nguồn của Minh CRISTIANO Blog nha, nếu có vấn đề về khiếu nại hay bản quyền thì hãy comnent xuống bên dưới. Chúc các bạn ngày làm việc hiệu quả.