如何显示和隐藏层,谢谢各位?

daqi2010 2009-12-26 10:02:36
有一层 DIV ID=MYCRM
有一按钮: ID=myinfo
要实现:
当点击按钮,层显示,并且可以操作层里面的相关链接。当鼠标移开层后,层自动隐藏。
谢谢各位了
...全文
117 15 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
15 条回复
切换为时间正序
请发表友善的回复…
发表回复
dandande 2009-12-26
  • 打赏
  • 举报
回复
<div id=div style="width:200;height:100;background:gray;visibility:hidden" onmouseout={this.style.visibility="hidden"}>
<a href="" onmouseover={div.style.visibility=""}>111</a><br>
<a href="" onmouseover={div.style.visibility=""}>222</a></div>
<input type=submit value="ok" onclick={div.style.visibility=""}>
licip 2009-12-26
  • 打赏
  • 举报
回复
getElementById('div').style.display='hidden' //隐藏
这个写错了。应该是:
getElementById('div').style.display='none' //隐藏
xmliy 2009-12-26
  • 打赏
  • 举报
回复

<div id="MYCRM" style="width: 300px; height: 200px; background-color:#E6E6E6; display:none">

<a href='http://www.baidu.com'>Baidu</a>
<button type="button">测试</button>
</div>
<input type="button" id="myinfo" value="ShowInfo" />



(function() {
var btn = document.getElementById('myinfo');
var div = document.getElementById('MYCRM');
btn.onclick = function() {
div.style.display = '';
div.onmouseout = function(e) {
e = e || window.event;
var target = e.srcElement ? e.srcElement : e.target,
related = e.toElement ? e.toElement : e.relatedTarget;
if (!div.contains(related)) div.style.display = 'none';
}
}
})();
街头小贩 2009-12-26
  • 打赏
  • 举报
回复
[Quote=引用 11 楼 daqi2010 的回复:]
(学而不思则罔) 的代码刚才试过了。可以,就是感觉代码有点多,
t6new.cn) 刚才试过了。如果我在DIV里面加入一些按钮什么的,就不行了。
感谢大家
[/Quote]
忽视了事件!代码多的情况可以用框架!
daqi2010 2009-12-26
  • 打赏
  • 举报
回复
(学而不思则罔) 的代码刚才试过了。可以,就是感觉代码有点多,
t6new.cn) 刚才试过了。如果我在DIV里面加入一些按钮什么的,就不行了。
感谢大家
Click_Me 2009-12-26
  • 打赏
  • 举报
回复

<div id="MYCRM" style="width: 300px; height: 200px; background-color:#E6E6E6; display:none">
<a href='http://www.baidu.com'>Baidu</a>
</div>
<input type="button" id="myinfo" value="ShowInfo" />
<script type="text/javascript">
(function(){
var contains = function(a, b) {
return a.contains ? a != b && a.contains(b) : !!(a.compareDocumentPositon(b) & 16);
}
function Event(e){
var oEvent = document.all ? window.event : e;
if (document.all) {
if(oEvent.type == "mouseout") {
oEvent.relatedTarget = oEvent.toElement;
}else if(oEvent.type == "mouseover") {
oEvent.relatedTarget = oEvent.fromElement;
}
}
return oEvent;
}
var btn = document.getElementById('myinfo');
var div = document.getElementById('MYCRM');
btn.onclick = function(){
div.onmouseout = function(event){
var target = Event(event).relatedTarget;
if(!contains(this, target)){
this.style.display = 'none';
this.onmouseout = null;
}else {
target.onmouseout = function(event) {
event = event || window.event;
if(event.stopPropagation) {
event.stopPropagation();
}else {
event.cancelBubble = true;
}
}
}
}
div.style.display = 'block';
}

})();
</script>
街头小贩 2009-12-26
  • 打赏
  • 举报
回复
[Quote=引用 6 楼 click_me 的回复:]
楼上的两位 误解楼主了.. 你们没注意 主要的问题是.. 鼠标移开DIV隐藏 但可以点击链接这个方面
这才是主要 呵呵
[/Quote]
VS
[Quote=引用楼主 daqi2010 的回复:]
当点击按钮,层显示,并且可以操作层里面的相关链接。当鼠标移开层后,层自动隐藏。
[/Quote]
daqi2010 2009-12-26
  • 打赏
  • 举报
回复
用了。鼠标移到DIV上就消失了。DIV里面有按钮事件,用ONBLUR也不行
街头小贩 2009-12-26
  • 打赏
  • 举报
回复

<!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>无标题文档</title>
</head>

<body>
<div id="MYCRM" style="display:none;width:100px;height:100px;border:1px solid #ddd;">
this is a layer

</div>
<input type="button" id="myinfo" value="myinfo" />
<script type="text/javascript">
document.getElementById('myinfo').onclick=function(){
var tm=document.getElementById('MYCRM');
tm.style.display='block';
tm.onmouseout=function(){
this.style.display='none';
}
}

</script>
</body>
</html>

Click_Me 2009-12-26
  • 打赏
  • 举报
回复

楼上的两位 误解楼主了.. 你们没注意 主要的问题是.. 鼠标移开DIV隐藏 但可以点击链接这个方面
这才是主要 呵呵
街头小贩 2009-12-26
  • 打赏
  • 举报
回复
[Quote=引用 2 楼 daqi2010 的回复:]
有一层 DIV ID=MYCRM
有一按钮: ID=myinfo
要实现:
当点击按钮,层显示,并且可以操作层里面的相关按钮。当鼠标移开层后,层自动隐藏。
谢谢各位了
[/Quote]
兄弟你不能自已也动动手!
街头小贩 2009-12-26
  • 打赏
  • 举报
回复
<button id='btn1' .... />
<script type='text/javascript'>
document.getElementById('btn1').onclick=function(){

getElementById('div').style.display='block'; //你要显示的层div
}
真哥哥 2009-12-26
  • 打赏
  • 举报
回复
当点击时document.getElementById('id').style.display="";
当鼠标离开时:$("#id").bind("mouseleave", function(){
menu = document.all.itemopen//itemopen是id
menu.style.display = "none"
});
daqi2010 2009-12-26
  • 打赏
  • 举报
回复
有一层 DIV ID=MYCRM
有一按钮: ID=myinfo
要实现:
当点击按钮,层显示,并且可以操作层里面的相关按钮。当鼠标移开层后,层自动隐藏。
谢谢各位了
街头小贩 2009-12-26
  • 打赏
  • 举报
回复
getElementById('div').style.display='hidden' //隐藏
getElementById('div').style.display='block' //打开

前 言 visual basic继承了basic语言易学易用的特点,特别适合于初学者学习windows系统编程。随着21世纪信息社会的到来,计算机在人们的工作和生活中的深入,要求我们越来越多地与计算机打交道,为了使用户在繁忙的日程工作中得到放松,于是出现了各种各样的休闲软件,如聊天工具,游戏等等。于是我们小组着手设计开始一个这样的游戏软件。通过这学期来Visual Basic的学习,我初步掌握了Visual Basic语言的最基本的知识,于是在化希耀张兵等老师的指导下动手用Visual Basic编写俄罗斯方块游戏。 无可争议,《俄罗斯方块》是有史以来最伟大的游戏之一。它是永恒的娱乐经典,但它实际上又和那些传统的经典娱乐方式不同,因为它的本质是电子化的,所以它的确属于现代产物。《俄罗斯方块》举世闻名的游戏性,在该游戏新鲜出炉时就显得非常直观。某些与坠落的玩具碎片和它们的形状有关的东西,使得哪怕新手也会很自然地企图把它们排列起来,并加以适当组合,就好似《俄罗斯方块》触动了我们某些内在的感官,使得哪怕是我们当中最杂乱无章的人也要把事情整理妥当。 在曾经发布过的所有游戏中,《俄罗斯方块》还被认为是仅有的一个能够真正吸引广泛人群的作品。某些批评家也许会声称,《俄罗斯方块》要比过去二十年间出现的任何东西都要浪费人们的时间。至于我们,则要欣然提名它为GameSpot评选出的历史上最伟大游戏之一。 为了怀念经典,也为了能够给大多的计算机用户在工作之余找到一个休闲、娱乐的一个方式,我们小组开始着手用VB语言开发一个经典的俄罗斯方块游戏。 工程概况 1.1 项目名称 俄罗斯方块游戏 1.2 设计平台 VB 全称Visual Basic,它是以Basic语言作为其基本语言的一种可视化编程工具。 Vb是microsoft公司于1991年退出的windows应用程序开发工具visual意思是“可视化的”。在它刚推出来时,自身还存在一些缺陷,功能也相对少一些。但是经过多年的开发研究。最近microsoft公司又推出了VB6.0版本 VB6.0运行环境:硬件,要求486以上的处理器、16MB以上内存,50MB 以上的硬盘,cd-rom驱动器,鼠标。软件:要求windows 95以上版本。 1.3程序设计思想 游戏是用来给大家娱乐的,所以要能在使用的过程中给大家带来快乐,消除大家的疲劳,所以我们在游戏中添加了漂亮的场景和动听的音乐,设置了过关升级的功能,激发大家的娱乐激情。 从游戏的基本玩法出发,主要就是俄罗斯方块的形状和旋转,我们在设计中在一个图片框中构造了一个4*4的网状小块,由这些小块组合成新的形状,每四个小块连接在一起就可以构造出一种造型,因此我们总共设计了7中造型,每种造型又可以通过旋转而变化出2到4种形状,利用随机函数在一个预览窗体中提前展示形状供用户参考,然后将展示的形状复制到游戏窗体中进行摆放,在游戏窗体中用户就可以使用键盘的方向键来控制方块的运动,然后利用递归语句对每一行进行判断,如果有某行的方块是满的,则消除这行的方块,并且使上面的方块自由下落,其中,方块向下的速度是有时钟控件控制的,在游戏中,用户也可以使用向下键加快下落速度,定义一个变量,对消除的函数进行记录,最后就可以得出用户的分数,用if 语句对分数判断,达到一定的积分就可以升级到下一个档次。 俄罗斯方块游戏设计的主要步骤为以下10个方面: (1)游戏界面的设计。 (2)俄罗斯方块的造型。 (3)俄罗斯方块的旋转。 (4)俄罗斯方块的运动情况(包括向左,向右和向下)。 (5)俄罗斯方块的自动消行功能。 (6)游戏级别的自由选择。 (7)游戏速度的自由选择。 (8)游戏得分的计算。 (9)游戏菜单选项的设计及功能实现。 (10)游戏的背景音乐。 1.4运用的控件和主要对象 我们在设计过程中主要用到的控件有:command控件,image控件,picture控件,label控件,timer控件,text控件,windows media player控件等等。 1.5主要实现的功能 我们开发的俄罗斯方块游戏,主要实现了以下几种功能: 1.可以灵活控制方块在图形框中运动。 2.游戏过程中方块可以自由旋转。 3.当某一行的方块排列满时,将自动将这一行方块消除,然后将上面所有方块向下移动,可以支持连续消行。 4.游戏前可以选择游戏的速度和游戏的等级,游戏速度既为方块下落速度,游戏等级为初始游戏时在基随机生成一定行数的无规律方块,生成的行数由你来选择,每行至少产生5个以上的无规律方块,这样增加了游戏难度,对于游戏高手来说,无疑不是一个新的挑战。 5.游戏的得分支持积分,并且按照公式: 得分 = 原来分数+ 100 * (2 ^ 同时消除的行数-1) 这样,你同一时间消除

87,997

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧