-->

Cách thêm hiệu ứng trái tim khi nhấp chuột cho Blogspot

 

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 Thành Trương 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ả.

Bài viết liên quan:

Đánh giá của Bạn về bài viết này?