-
Posts
-
hey i found this code for changing the color of the sonar effect – the hover effect for icons with links.
/*sonar effect*/
@-webkit-keyframes sonarEffect {
0% {opacity: 0.3;}
40% {opacity: 0.5;box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255,255,255,0.5);}
100% {box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255,255,255,0.5);-webkit-transform: scale(1.5);opacity: 0;}
}
@-moz-keyframes sonarEffect {
0% {opacity: 0.3;}
40% {opacity: 0.5;box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255,255,255,0.5);}
100% {box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255,255,255,0.5);-moz-transform: scale(1.5);opacity: 0;}
}
@keyframes sonarEffect {
0% {opacity: 0.3;}
40% {opacity: 0.5;box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255,255,255,0.5);}
100% {box-shadow: 0 0 0 2px rgba(255,255,255,0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255,255,255,0.5);transform: scale(1.5);opacity: 0;}
}Now i want to change it for individual classes of icons. Can i do it, this way?
@-webkit-keyframes sonarEffect .individalclass { …}
aso. ?Hey tobego,
You could try to turn on the custom CSS field for all ALB elements to target the elements of your choice: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
Best regards,
Rikardhey rikard,
yes i will do it. Is this semantical correct? @-webkit-keyframes sonarEffect CSS CLASS { …}
Hey!
Yes it look alright to me for a full list please check this link https://css-tricks.com/snippets/css/keyframe-animation-syntax/
Regards,
Vinay
- The topic ‘how to change color for sonareffect on icons with links’ is closed to new replies.