点击一个div隐藏另一个div
<!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>点击一个div隐藏另一个div</title> <script type="text/javascript">
function shwoOrHidden(){
if(document.getElementById("d1").style.display=='block'){
document.getElementById("d1").style.display='none';
document.getElementById("d2").style.display='block';
}else if(document.getElementById("d1").style.display=='none'){
document.getElementById("d1").style.display='block';
document.getElementById("d2").style.display='none';
}
}
</script>
</head>
<body>
<div id="d1" style="height:150px; width:150px; border:1px solid #009900; display:block; position:absolute;" onclick="shwoOrHidden()">
</div> <div id="d2" style="height:150px; width:150px; border:1px solid #FFFF00; display:none; position:absolute; left:200px;" onclick="shwoOrHidden()">
</div>
</body>
</html>
点击一个div隐藏另一个div的更多相关文章
- select下拉选中显示对应的div隐藏不相关的div
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 原生JS实现点击一个按钮显示一个div,再点击按钮div隐藏,或点击除div外其它空白处div隐藏
<!DOCTYPE html> <html style="font-size: 24px"> <head> <title>js点击按 ...
- 点击一个按钮,如何让一个<div id=a>……</div>隐藏或显现?
<div id=divid>123</div>< button onclick="usr()">Click</button>< ...
- 设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示;当页面滚动到起始位置时,头部div出现,底部div隐藏
设置一个div网页滚动时,使其固定在头部,当页面滚动到距离头部300px时,隐藏该div,另一个div在底部,此时显示: 当页面滚动到起始位置时,头部div出现,底部div隐藏 前端代码: <! ...
- 一个大div里面包裹一个小div,里面的小div的点击事件不触发外面的这个大div的点击事件
一开始上html代码 <div id="div1" style="background: blue;width: 100px; height: 100px;&quo ...
- jquery效果,多个div,点击任何一个div,那么这个div会切换文字,变换背景颜色,再次点击其他的div ,这个div会发生刚才的变化,之前点击的div的颜色会变回来
首先css样式: /*原来的背景色*/ .bg { background:'red' } /*需要切换的背景色*/ .bg_click { background:'green' } JS: $('di ...
- 点击自动显示/隐藏DIV代码。(简单实用)
注:本文由Colin撰写,版权所有!转载请注明原文地址,谢谢合作! 很多时候我们需要将DIV的信息默认为隐藏状态,只有当用户点击时才显示DIV中包含的提示文字.这类效果在互联网上应用得很多,但实现的方 ...
- 点击按钮显示隐藏DIV,点击DIV外面隐藏DIV
点击按钮显示隐藏DIV,点击DIV外面隐藏DIV 注意:此方法对touch事件不行,因为stopPropagation并不能阻止touchend的冒泡 <style type="tex ...
- JaveWeb 公司项目(1)----- 使Div覆盖另一个Div完成切换效果
最近在做网页,用的是CSS+DIV的布局方法,搭建了一个简易的界面,大体上分为三个部分,如图所示: 左侧的为主功能导航栏,右侧是具体的功能实现,下方是固定的版权声明,单击左边不同的导航按钮,在div中 ...
随机推荐
- java内部类技术提炼
创作时间:2016.07.28,2016.07.29 本人qq:992591601,欢迎交流. 参考书籍:<Thinking in Java>.<Effective Java> ...
- jq里延迟对象Deferred,状态变化后,会一直保持
var defer = $.Deferred(); defer.resolve('abc'); defer.done(function (data) { console.log(data); }) d ...
- 合法提交Html标签 Page指令
3.2.1 提交合法的HTML标签(1) 有时候我们需要让我们提交的文本展示出来的效果非常美观,通常会对服务器提交一些HTML标签来控制文本或内容的样式. HTML标签可能包含了很多不安全的因素,所以 ...
- Atitit 马尔可夫过程(Markov process) hmm隐马尔科夫。 马尔可夫链,的原理attilax总结
Atitit 马尔可夫过程(Markov process) hmm隐马尔科夫. 马尔可夫链,的原理attilax总结 1. 马尔可夫过程1 1.1. 马尔科夫的应用 生成一篇"看起来像文章的 ...
- atitit 短信接口规范与短信解决方案.docx
atitit 短信接口规范与短信解决方案.docx 1.1. 国内比较著名的短信提供商1 1.2. 短信接口规范1 1.3. 短信sdk构成1 1.4. 短信的实现1 1.5. SmsServiceY ...
- javascript_basic_04之节点、元素
1.DOM:文档对象模型,Document Object Model: 2.BOM:浏览器对象模型,Browser Object Model: 3.DOM组成:核心DOM,XML DOM,HTML D ...
- apache多站点配置
apache多站点配置 临时需要个测试站,然后就到apache中配置vhosts,结果这货总是显示"拒绝了你的请求",找半天发现居然还要添加端口监听 vhosts.conf 添加v ...
- 【原创】NIO框架入门(三):iOS与MINA2、Netty4的跨平台UDP双向通信实战
前言 本文将演示一个iOS客户端程序,通过UDP协议与两个典型的NIO框架服务端,实现跨平台双向通信的完整Demo.服务端将分别用MINA2和Netty4进行实现,而通信时服务端你只需选其一就行了.同 ...
- s2sh框架搭建(基于spring aop)
对于spring aop 是如何管理事务的,请看一下:http://bbs.csdn.net/topics/290021423 1.applicationContext.xml <?xml ve ...
- struts深入理解之登录示例的源码跟踪
废话不多,直接上图:(色泽比较重的是追踪的路径)