Utilizamos cookies para ajudar você a navegar com eficiência e executar certas funções. Você encontrará informações detalhadas sobre todos os cookies sob cada categoria de consentimento abaixo.
Os cookies que são classificados com a marcação “Necessário” são armazenados em seu navegador, pois são essenciais para possibilitar o uso de funcionalidades básicas do site....
Os cookies necessários são cruciais para as funções básicas do site e o site não funcionará como pretendido sem eles.
Esses cookies não armazenam nenhum dado pessoalmente identificável.
Cookies funcionais ajudam a executar certas funcionalidades, como compartilhar o conteúdo do site em plataformas de mídia social, coletar feedbacks e outros recursos de terceiros.
Cookies analíticos são usados para entender como os visitantes interagem com o site. Esses cookies ajudam a fornecer informações sobre métricas o número de visitantes, taxa de rejeição, fonte de tráfego, etc.
Os cookies de desempenho são usados para entender e analisar os principais índices de desempenho do site, o que ajuda a oferecer uma melhor experiência do usuário para os visitantes.
Os cookies de anúncios são usados para entregar aos visitantes anúncios personalizados com base nas páginas que visitaram antes e analisar a eficácia da campanha publicitária.
CSS - Dicas
A pulsação é muito boa para poder chamar a atenção de algum item especifico, como um botão. Nesta página no canto direito inferior demos a demonstração de como funciona.
Para conseguirmos fazer isso vamos utilizar os seguintes códigos:
contato@geovaniassis.dev.br <a class="buttom-whats"></a><style type="text/css">
.buttom-whats{
position:fixed;
width:60px;
height:60px;
bottom:40px;
right:40px;
background-color:#25d366;
color:#FFF;
border-radius:50px;
text-align:center;
font-size:30px;
box-shadow: 1px 1px 2px #888;
z-index:1000;
}
.buttom-whats::after {
content: '';
width: 30px;
height: 30px;
border-radius: 100%;
border: 6px solid #9C27B0;
position: absolute;
z-index: -1;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
animation: ring 1.5s infinite;
}
@keyframes ring {
0% {
width: 30px;
height: 30px;
opacity: 1;
}
100% {
width: 100px;
height: 100px;
opacity: 0;
}
}
</style>
