Para instalar o efeito de pulsar em algum elemento de sua página, siga este passo a passo abaixo:
1. Acesse o seu editor de páginas;
2. Clique no ícone de engrenagem localizado no canto superior direito da sua tela;
3. Em seguida, selecione a opção Javascript/Css;
4. Clique em Adicionar código;
5. Dê um nome ao código, classifique-o como funcionamento e instale o código abaixo:
<style>
#e0000000 .c {
–pulse: 0 0 0 0 #7fff00;
animation: pulse 3s infinite;
-webkit-animation: pulse 3s infinite;
-moz-animation: pulse 3s infinite;
-o-animation: pulse 3s infinite;
}
@-webkit-keyframes pulse {
0% {
-webkit-box-shadow: var(–pulse)
}
70% {
-webkit-box-shadow: 0 0 0 20px rgba(0, 200, 0, 0)
}
100% {
-webkit-box-shadow: 0 0 0 0 rgba(0, 200, 0, 0)
}
}
@-o-keyframes pulse {
0% {
-webkit-box-shadow: var(–pulse)
}
70% {
-webkit-box-shadow: 0 0 0 20px rgba(0, 200, 0, 0)
}
100% {
-webkit-box-shadow: 0 0 0 0 rgba(0, 200, 0, 0)
}
}
@-ms-keyframes pulse {
0% {
-webkit-box-shadow: var(–pulse)
}
70% {
-webkit-box-shadow: 0 0 0 20px rgba(0, 200, 0, 0)
}
100% {
-webkit-box-shadow: 0 0 0 0 rgba(0, 200, 0, 0)
}
}
@-moz-keyframes pulse {
0% {
-webkit-box-shadow: var(–pulse)
}
70% {
-webkit-box-shadow: 0 0 0 20px rgba(0, 200, 0, 0)
}
100% {
-webkit-box-shadow: 0 0 0 0 rgba(0, 200, 0, 0)
}
}
@keyframes pulse {
0% {
-webkit-box-shadow: var(–pulse)
}
70% {
-webkit-box-shadow: 0 0 0 20px rgba(0, 200, 0, 0)
}
100% {
-webkit-box-shadow: 0 0 0 0 rgba(0, 200, 0, 0)
}
}
</style>
6. Em seguida, você vai precisar identificar o ID do elemento em que o efeito será aplicado;
7. Depois disso, informe no campo destacado abaixo o código da cor que gostaria de aplicar com o efeito de pulsar;
Por fim, clique em “Salvar”.
