html - targeting different div styles with target method -
hello using target method manipulate different div styles, first "link_one" working, while have 1 link, question how make work "link_two" ? link_two second part of css ? more important here each link maniluplating 2 different classes in link 1 , 2 1 of class same.
<a href="#sections">link_one</a> <div id="sections"> <div id="link_one">info</div> <div id="link_two">info</div> </div> /* link 1 code */ #sections:target #link_one{ height:90px; background:#333; transition:all 1s ease; } #sections:target .rslides { height:0px; transition:all 1s ease; } /* link 2 code */ #sections:target #link_two{ height:90px; background:#333; transition:all 1s ease; } #sections:target .rslides { height:0px; transition:all 1s ease; }
one way apply target selector be:
for html
<a href="#sections1">link_one</a> <br> <a href="#sections2">link_two</a> <div id="sections1"></div> <div id="sections2"></div> <div id="link_one" class="link">info</div> <div id="link_two" class="link">info</div>
set css
.link { height: 20px; transition:all 1s ease; } #sections1:target ~ #link_one{ height:90px; background:#333; } #sections2:target ~ #link_two{ height:90px; background:#333; }
Comments
Post a Comment