Hello Friends, Welcome again to all of you in today's new post. In this post I will share with you all a tutorial on how to add mouse effect on blogger. By adding this effect, as soon as your website visitors come to your website, as soon as they click on your website, this mouse effect will be visible on your website.
This mouse effect effect is created with the help of HTML, CSS, JavaScript and JQuery. You may have seen on other people's website or blog, when you click after visiting their website, the effect of mouse click will be given.
I will share a very easy tutorial on this in this post, you will be able to use it very easily on your blog by reading this post. So follow the given steps till the end.
How To Add Mouse Click Effect in Blogger :-
</head>
.
<style type="text/css">
/* Mouse Click Effect Css By Www.SmartTechMukesh.Com */
.mteffect{width:60px;height:60px;border-radius:99em;border:3px solid #6200ee;position:fixed;left:50%;transform:scale(0.5);display:none;z-index:999}.mteffect.active{display:block;animation:mteffect 0.4s ease-out forwards}
@keyframes mteffect{from{transform:scale(0.2);opacity:1}to{transform:scale(1);opacity:0}}
</style>
</body>
.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js'></script>
<script>//<![CDATA[
$("body").append($('<span class="mteffect"></span>')),$(document).on("click",function(n){var i=n.clientX,a=n.clientY;$(".mteffect").css({top:a-30,left:i-30}).addClass("active")}),$(".mteffect").on("animationend webkitAnimationEnd oAnimationEnd oanimationend MSAnimationEnd",function(){$(".mteffect").removeClass("active")});
//]]>
</script>
Conclusion :-
You all must have understood this easy way to add mouse click effect on blogger website. In this post I told how to add mouse click effect in blogger. I hope this tutorial can be useful for all of you new and old bloggers and developers. Thank you for visiting our website.
Refrence :
Www.SmartTechMukesh.Com
Its not working. Please fix it
ReplyDelete