欢迎来到Doc100.Net免费学习资源知识分享平台!
您的位置:首页 > 程序异常 >

点击空白处隐藏的有关问题,前辈们给点指教呐

更新时间: 2014-01-05 01:51:10 责任编辑: Author_N1

 

点击空白处隐藏的问题,前辈们给点指教呐。

<!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=utf-8" />
<title></title>
<link rel="stylesheet" href="css/base.css" type="text/css" />
<style type="text/css">
.box{width:200px;margin:0 auto;display:table;margin-top:20px;}
.lable1{width:200px;float:left;position:relative;}
.box div span{width:190px;height:25px;line-height:25px;border:1px solid #666;padding-left:8px;font-size:14px;display:block;}
.box div dl{height:200px;overflow-x:hidden;overflow-y:auto;position:absolute;top:27px;display:none;}
.box div dl dd{width:200px;padding-top:1px;}
.box div dl dd a{width:200px;display:block;line-height:30px;color:#900;background:#CCC;font-size:15px;text-align:center;}
.box div dl dd a:hover{color:#ccc;background:#900;}
</style>
<script language="javascript" src="js/jquery.min.js"></script>
<script language="javascript">
$(function(){
$(".lable1").silder();    
});
;(function($) {
$.fn.silder = function(){
var $this=this,
span=$this.find("span"),
dl=$this.find("dl");
a=dl.find("a");
span.click(function(){
dl.stop(true,true).slideDown();   
});
a.click(function(){
span.text(this.innerHTML);
dl.stop(true,true).slideUp();
});
$(document).click(function(){
dl.stop(true,true).slideUp();
});
};
})( jQuery ); 
</script>
</head>
<body>
<div class="box">
<div class="lable1">
     <span></span>
        <dl>
         <dd><a href="javascript:void(0)">下拉菜单一</a></dd>
         <dd><a href="javascript:void(0)">下拉菜单二</a></dd>
         <dd><a href="javascript:void(0)">下拉菜单三</a></dd>
         <dd><a href="javascript:void(0)">下拉菜单四</a></dd>
         <dd><a href="javascript:void(0)">下拉菜单五</a></dd>
         <dd><a href="javascript:void(0)">下拉菜单六</a></dd>
         <dd><a href="javascript:void(0)">下拉菜单七</a></dd>
         <dd><a href="javascript:void(0)">下拉菜单八</a></dd>
         <dd><a href="javascript:void(0)">下拉菜单九</a></dd>
         <dd><a href="javascript:void(0)">下拉菜单十</a></dd>
         <dd><a href="javascript:void(0)">下拉菜单十一</a></dd>
        </dl>
    </div>
</div>
</body>
</html>

--参考方法--

//$(document).click(function(){
//          dl.stop(true,true).slideUp();
//        });
$("body,html,.box").click(function(){
if(this !== window.event.srcElement)
return;
            dl.stop(true,true).slideUp();
        });
上一篇:上一篇
下一篇:下一篇

 

随机推荐程序问答结果

 

 

如对文章有任何疑问请提交到问题反馈,或者您对内容不满意,请您反馈给我们DOC100.NET论坛发贴求解。
DOC100.NET资源网,机器学习分类整理更新日期::2014-01-05 01:51:10
如需转载,请注明文章出处和来源网址:http://www.doc100.net/bugs/t/2038/
本文WWW.DOC100.NET DOC100.NET版权所有。