用Jquery写一个点击展示下拉菜单,再点击收起来

原创 2015年11月21日 16:35:15




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>第一个简单的jQuery程序</title>
    <script language="javascript" type="text/javascript" src="jquery-1.4.2.min.js">
    </script>
    
<style type="text/css">
  .divFrame{width:269px;border:solid 1px #666;
     font-size:10pt}
 .divTitle{background-color:#eee;padding:5px}
 .divContent{padding:5px;display:none}
 .divCurrColor{background-color:Red}
</style>
    
</head>
<body>
    <div class="divFrame">
   <div class="divTitle">主题</div>
<div id="test" class="divContent">
  <a href="#">link 1</a><br/>
  <a href="#">link 2</a><br />
  <a href="#">link 3</a>
</div>
</div>
   
</body>
   <script type="text/javascript">
       //页面载入事件
  $(function()
  {
     $(".divTitle").click(function()
 {
 
    var temp1=$("#test").is(":visible");
if(!temp1) //可见与否其实是一个css属性,当要修改其可见性时可以更改它的属性
{
  
  $(this).addClass("divCurrColor")     //当前添加一个背景色
      .next(".divContent").css("display","block");
}
else
{
  $('#test').css('display','none');
}
    
   
 });
  });
       
    </script>

</html>


版权声明:本文为博主原创文章,未经博主允许不得转载。 举报

相关文章推荐

Axure实现选择下拉菜单后点击确认按钮,跳转到对应页面

快速实现选择下拉菜单后点击确认按钮,跳转到对应页面

Axure RP 8.0 用中继器(repeater)完成按钮点击添加下拉菜单和文字

Axure RP 8.0 利用中继器(repeater)完成按钮点击添加一行(下拉菜单,文字,图片) 中继器是axure 7带来的功能,它的主要用途在于:一次性添加一组元件,并可以赋值。

我是如何成为一名python大咖的?

人生苦短,都说必须python,那么我分享下我是如何从小白成为Python资深开发者的吧。2014年我大学刚毕业..

TableView的点击出现和关闭下拉菜单的实现

之前开发过程中总是会遇到很多问题,百度后会根据大家写的博客找到解决方法,不得不说还是非常感谢各位博主的开源奉献的精神。所以我也开个博客,把在项目开发中的一些点点滴滴记录下来。目前项目中要实现一个功能,...

android利用PopupWindow实现点击工具栏弹出下拉菜单

本文介绍了如何利用PopupWindow实现点击屏幕顶部工具栏按钮弹出下拉菜单的功能。

jq无限极下拉菜单和点击展开菜单

一、html部分 Document 菜单项1 ...

JS实现点击按钮图片左右切换、点击图片按钮出现下拉菜单

前天帮祥哥他女票做个网页作业,大概要求就是使用两个按钮控制图片的切换,在页面右上角出现一个图片按钮,点击这个按钮出现下拉菜单。 第一个要求还是很简单的,第二个多花了我几个小时的时间,因为我只做过se...

css+jquery(js)写下拉菜单

html中select是满足不了广大用户对下拉菜单的需求那么我们可以用css+jq来订制自己想要的下拉菜单; 代码如下: Document <script type="...
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)