html鼠标点击出现下来（收缩）实现方法

如何实现html鼠标点击出现下来（收缩）的方法？这个应该会经常用到

有时候我们需要点击一个文字或者图片的时候出现一个下拉的页面，再点击就会收缩回去，比如需要一个隐藏的表单，点击某处才出来的时候，今天分享下这个相关代码！做之前需要加载一个jquery

<script src="js/jquery-1.4.2.min.js"></script>

<script type="text/javascript">

       $(document).ready(function(){

$("#ljhinput").click(function(){

    $("#leoinput").slideToggle("slow");

  });

});  

</script>

<div id="ljhinput"></div> <!--这个是需要点击的div，如果里面是图片或者文字，就把id写图片和文字上-->

<div id="leoinput" style="display: none;"><!--这个是点击后出现的DIV页面，刚进来是需要隐藏起来的，所以写了个style-->

这样就实现了点击后上下收缩的网页！