鼠标点击层以外的地方层隐藏

最新推荐文章于 2022-07-06 14:29:18 发布

porschev

最新推荐文章于 2022-07-06 14:29:18 发布

阅读量4.1k

点赞数

分类专栏： HTML 文章标签： function div xhtml server html c#

本文链接：https://blog.csdn.net/porschev/article/details/5974177

版权

HTML 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

根据去哪儿（http://www.qunar.com/）输入框点击按钮而写

实现功能效果：

1、点击按钮，相应层显示，点击层以外的部分层隐藏;

2、重复点击按钮时，按钮附属层显示时变隐藏，反之亦然;

3、如果一个页面上有两个以上这种效果，层会有互斥效果;

http://www.dtan.so

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default5.aspx.cs" Inherits="Default5" %> <!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 runat="server"> <title>Porschev----鼠标点击层以外的地方层隐藏</title> <mce:script src="jquery-1.3.2-vsdoc.js" mce_src="jquery-1.3.2-vsdoc.js" type="text/javascript"></mce:script> <mce:script type="text/javascript"></mce:script> </head> <body> <form id="form1" runat="server"> <div style="width:995px;height:900px"> <div name="divClick" style="color:#000000;font-weight:bold;cursor:pointer;" mce_style="color:#000000;font-weight:bold;cursor:pointer;" >打开</div> <div name="cont" style="width:200px;height:100px;background:#0000CC;color:#FFFFFF;display:none;">中国</div> <div name="divClick" style="color:#000000;font-weight:bold;cursor:pointer;" mce_style="color:#000000;font-weight:bold;cursor:pointer;" >打开</div> <div name="cont" style="width:200px;height:100px;background:#0000CC;color:#FFFFFF;display:none;">中国</div> </div> </form> </body> </html>