Jump to content

HenryM

Circle Member
  • Posts

    1
  • Joined

  • Last visited

HenryM's Achievements

Level 1

Level 1 (1/20)

0

Reputation

  1. Site URL: https://www.inspireconference.tv/ Hey guys, im trying to do this effect that i saw on this Website. It's an on hover effect and when you hover over the image of one of the speakers, the img darkens and the text disappears but more text (the description of the person) appears. How would i do this using css? I currently have //this darkens the img. (turns opacity down on hover over .5 seconds) #block-yui_3_17_2_1_1659569849378_173807:hover { -webkit-filter: brightness(20%); -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all 1s ease; transition: all .5s ease; } But when i try so add another #block after hover, like this it wont work: #block-yui_3_17_2_1_1659569849378_173807:hover #block-yui_3_17_2_1_1659569849378_572143 { opacity: 0; } #block-yui_3_17_2_1_1660170606940_7219 { opacity: 100% } { -webkit-filter: brightness(20%); -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; -ms-transition: all 1s ease; transition: all .5s ease; } Please help me figure out what i can do to make this work. Thanks guys.
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.