html - Div focus using css -
html
<div class="div1"> <ul class="dropdown"> <li>example</li> </ul> <div>
css
.dropdown{ visibility: hidden } .div1:focus .dropdown{ visibility: visible }
i'm trying make click event in css using focus without jquery , need when clicking on div1 hide dropdown ul.
is there way that?
you can't "focus", may "active". active accepted browsers "click" event (i.e. while click on element active). check code below. have tested chrome , works intended. tested internet explorer; "sort-of" works (the second selector ie).
hope helps out. luck!
<!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <html lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>title goes here</title> <style> body {background-color:lightgray} h1 {color:blue} p {color:green} .div1 { border: 1px solid green; } .div1:active .dropdown { display: none; } .dropdown:active { display: none; } </style> </head> <body> <p>this web page</p> <div class="div1"> test <ul class="dropdown"> <li>example</li> </ul> <div> </body> </html>
Comments
Post a Comment