html - Opacity when hovering DIV or other Element -
i want apply opacity: 1;
paragraph when hovering on (i have figured out) and when hover header above it.
this css
.testh { font-family: impact; text-align: center; font-size: 50px; transition: 1s; } .testp { text-align: center; opacity: 0.5; font-size: 18px; transition: 1s; } #testhdiv:hover { opacity: 1; } .testp:hover { opacity: 1; }
my html
<div id="testhdiv"><h1 class="testh"><b>< ></b></h1> <p class="testp">text , text, more text<br>bla bla bla bla</p> </div>
so, can see try opacity paragraphs current 0.5, 1 when hovering div - idea is: being able hover "box"/the div, , text becomming less transparent. though think opacity
on hover of div not work div defined div, not text, , therefor can't transparent?
i have been struggling while now. wanting this: http://demo.web3canvas.com/themeforest/flathost/onepage/index.html#testimonials, hover within range of text , being zoomed - in case, opacity.
you can set class <p>
or just, use operator set :hover
paragraph.
example:
#testhdiv:hover > p { opacity: 1; }
Comments
Post a Comment