首页 > 建站/维护 > html鼠标点击出现下来(收缩)实现方法
2015
03-29

html鼠标点击出现下来(收缩)实现方法


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

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

html鼠标点击出现下来(收缩)实现方法


<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-->


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


文章来源小灰技术博客