Olá leitores, hoje vou mostrar como adicionar efeito de clique do cursor no Blogger – Ao criar esse efeito de clique, nosso site fica ainda mais animado e bonito. Este efeito de mouse foi criado usando HTML, CSS, JavaScript e JQuery. Você pode ter visto no site ou blog de outras pessoas, se você clicar depois de visitar o site deles, o efeito do clique terá efeito.
1. Siga para o painel do Blogger > Tema > Editar HTML
2. Copie todo o código abaixo e cole-o acima da tag </head>
<style type="text/css">
/* Mouse Click Effect Css thotbuzz.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>
3. Copie todo o código abaixo e cole sobre a tag </head> e salve.
<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>Leia mais: 5 dicas para que seu blog seja aceito pelo Google AdSense
Conclusão
Neste artigo eu fiz um tutorial passo a passo sobre Como adicionar efeito de clique do cursor no Blogger – espero que tenham gostado e por favor compartilhem com seus amigos e sigam nosso blog para mais conteúdos.
Se você enfrentar algum problema no código ou tiver alguma dúvida, sinta-se à vontade para perguntar na seção de comentários ou entre em contato conosco