input license here

Share Code Hiệu Ứng Thả TYM Khi Click Chuột

Hiệu Ứng Thả Tim Khi Click Chuột

Hí các bạn, chào mừng các bạn đã đến với bài viết tiếp theo của mình. Tiếp tục chuyên mục Blogger Tricks mình sẽ chia sẻ cho các bạn code thả tim khi bạn click chuột vào màn hình.

Share Code Hiệu Ứng Thả TYM Khi Click Chuột

Nếu bạn muốn biết thả tim như thế nào hãy click vào bất cứ đâu trên màn hình, một hình trái tim sẽ từ từ bay lên mờ dần rồi biết mất từ nơi bạn click.

Hướng Dẫn

  • Bưới 1: Copy toàn bộ đoạn code dưới đây:

    <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 2: Dán toàn bộ đoạn code trên vào trước thẻ đóng </body>
  • Bước 3: Lưu template lại rồi bật blog lên click xem thành quả!

Lời Kết

Vậy là trên đây mình đã chia sẻ cho các bạn cách thêm hiệu ứng thả tym khi click vào màn hình cho blogspot. Nếu cảm thấy hay hãy comment bên dưới cho mình biết. Chúc các bạn một ngày làm việc và học tập hiệu quả!

Copyright © www.insurancefinances.com

Tham Khảo:
Code Pro

Related Posts
Diệp Quân
Nguyen Manh Cuong is the author and founder of the vmwareplayerfree blog. With over 14 years of experience in Online Marketing, he now runs a number of successful websites, and occasionally shares his experience & knowledge on this blog.
SHARE

Related Posts

Subscribe to get free updates

Post a Comment

Sticky