jquery - Target for Hover to an already Hovered element -
i trying accomplish hover effect in when div hover tick mark appeared using following code:
#asked-question-answers .question.ref-ans:hover::before{ content: '\e8a7'; speak: none; display: inline-block; font: normal normal normal 24px/1 'material-design-icons'; text-rendering: auto; -webkit-font-smoothing: antialiased; transform: translate(0,0); position: absolute; left: 20px; margin-top: 20px; font-size: 34px; color: #ccc; }
now want apply hover selected on tick mark using following(failed try) code gray tick becomes green:
#asked-question-answers .question.ref-ans::before:hover{ color: green; }
as mentioned paulie_d , cbroe, not able define hover action on pseudo elements. can instead create tick mark absolute
positioned element in html markup opacity:0;
.
#asked-question-answers .question.ref-ans #tickmark { position: absolute; top: ...; left: ...; opacity: 0; // other styling }
on hover action on parent element, can change opacity
this:
#asked-question-answers .question.ref-ans:hover #tickmark { opacity: 1; }
for tick mark itself, can define hover action this:
#tickmark:hover { color: green; }
remember can specify acceptable type of selector instead of #tickmark
.
Comments
Post a Comment