javascript - Making drop down menu by click using css -


this question has answer here:

i have simple example of drop down menu click using ajax:

http://jsfiddle.net/dmitry313/1s62x8hc/2/

html:

<a href="javascript:void(0);" class="dropmenu">dropdown menu</a> <ul style="display:none">     <li><a href="#">dropdown link 1</a></li>     <li><a href="#">dropdown link 2</a></li> </ul> 

script:

 $(document).ready(function () {         var click = function () {             var divobj = $(this).next();             var nstyle = divobj.css("display");             if (nstyle == "none") {                 divobj.slidedown(false, function () {                     $("html").bind("click", function () {                         divobj.slideup();                     });                 });             }         };         $(".dropmenu").click(click);     }); 

is possible make same without script, using css?

edit: updated link

you can trigger css click using hack!!

work checkbox!!

sample:

      ul{              display: none;          }          #checkbox{              opacity: 0;          }          #checkbox:checked + ul {                            display: block;          }
    <div class="container">          <label for="checkbox">dropdown menu</label>          <input id="checkbox" type="checkbox" />                  <ul>              <li><a href="#">dropdown link 1</a></li>              <li><a href="#">dropdown link 2</a></li>          </ul>      </div>

you can use transitions animate show hide effect :) simple example!!

mention: css3 hack if need borwser support old browsers not working.


Comments

Popular posts from this blog

php - Submit Form Data without Reloading page -

linux - Rails running on virtual machine in Windows -

php - $params->set Array between square bracket -