利用JS做到隐藏div和显示div - 我爱贝贝 - 金东浩官方网站 - welcome to old.bbmy.net

利用JS做到隐藏div和显示div [金东浩官方网站版权所有]

2009年6月19日 | Category: » | by: 贝爸 | 本文包含金东浩利用JS做到隐藏div和显示div照片

利用JS做到隐藏div和显示div

代码如下:
<script language="javascript">
//创建一个showhidediv的方法,直接跟ID属性
function showhidediv(id){
var sbtitle=document.getElementById(id);
if(sbtitle){
   if(sbtitle.style.display=='block'){
   sbtitle.style.display='none';
   }else{
   sbtitle.style.display='block';
   }
}
}
</script>
<div id="show" onMouseMove='showhidediv("msg")';>鼠标移动这里</div><!--这里是点击div,ID要下面的ID-->
<div id="msg" style="display:none;">出现显示的内容</div> <!--这里是MsgDiv-->


onMouseMove='showhidediv("msg")'; 这里是鼠标动作,可以替换成Click或其他!

再次升级,做两个层之间的切换:


<script language="javascript">
//创建一个showhidediv的方法,直接跟ID属性
function showhidediv(id){
var age=document.getElementById("msg_2");
var name=document.getElementById("msg_1");
if (id == 'name') {
   if (name.style.display=='none') {
    age.style.display='none';
    name.style.display='block';
   }
} else {
   if (age.style.display=='none') {
    name.style.display='none';
    age.style.display='block';
   }
}  
}
</script>
<div id="show" style="float:left;" onMouseMove='showhidediv("name")';>Name:</div><div id="show" style="float:left;" onMouseMove='showhidediv("age")';>Age:</div>
<div id="msg_1" style="display:none;float:left;">林雨林</div>
<div id="msg_2" style="display:none;float:left;">18</div>


本文来自Memory's Blog

本文来自 我爱贝贝[www.bbmy.net]-金东浩官方网站,如若转载注明出处。


金东浩博客随机日志
金东浩博客之宝宝鼻子不通,只能抱着睡了
宝宝鼻子不通,只
金东浩博客之好吃的棒棒糖
好吃的棒棒糖
金东浩博客之骑电动马
骑电动马
金东浩博客之圣诞快乐
圣诞快乐
金东浩博客之小贝爱洗脚
小贝爱洗脚
金东浩博客之测试一下新做的flv播放器
测试一下新做的f
金东浩博客之照相机当摄像机使唤
照相机当摄像机使
金东浩博客之学步车上的小贝
学步车上的小贝
金东浩博客之可怜的小贝
可怜的小贝
金东浩博客之小贝在家受折磨
小贝在家受折磨
金东浩博客之小贝掉到地上了!
小贝掉到地上了!
金东浩博客之朋友给的佳能EOS-350D
朋友给的佳能EO
金东浩博客之大年初一带宝宝出去玩
大年初一带宝宝出
金东浩博客之年初三贝贝妈咪说要带宝宝去公园
年初三贝贝妈咪说
金东浩博客之小贝回家了
小贝回家了
金东浩博客之第一次去肯德基
第一次去肯德基
金东浩博客之抽空做了一个桌面壁纸
抽空做了一个桌面
金东浩博客之宝宝就快要过生日了
宝宝就快要过生日

金东浩日记Tags: ,
金东浩日记评论: 0 | 金东浩日记引用: 0 | 金东浩日记阅读: 1444
发表评论
昵称 [注册]        网址
密码 游客无需密码     电邮
打开HTML 打开UBB 打开表情 隐藏 记住我