html鼠标点击出现隐藏div(html 按钮隐藏)
鼠标点击事件 div 显示隐藏 问题
head
meta http-equiv="Content-Type" content="text/html; charset=utf-8"
title01 - 折叠菜单/title
style type="text/css"
.menu{border:solid 1px #00ff40; width:80px;height:22px; background:#1d5c45; padding:5px;overflow:hidden;}
.menu a{display:block;font-size:17px;font-family:"微软雅黑";text-align:center;height:24px;text-decoration:none; line-height:24px;color:#000000;}
.menu a:hover{border:dashed 1px #ffff00;;color:#FFFFFF; font-size:15px;background:#9dbbab;}
.title_Menu{height:12px;background:#9dbbab;}
.body_Menu{background:#g;}
/style
script type="text/javascript"
window.onload = function(){
var tit_a = document.getElementsByTagName("a");
function action(){
if(this.parentNode.offsetHeight == 34){
this.parentNode.style.height = "auto";
}else{
this.parentNode.style.height = "25px";
}
}
for( var r,i=0;r=tit_a[i++];){
console.log(r);
if(r.className == "title_Menu"){
r.onclick = action;
}
}
}
/script
/head
body
div class="menu"
a href="#" class="title_Menu"荤 菜/a
a href="#" class="body_Menu"荤菜1/a
a href="#" class="body_Menu"荤菜2/a
a href="#" class="body_Menu"荤菜3/a
a href="#" class="body_Menu"荤菜4/a
a href="#" class="body_Menu"荤菜5/a
/div
div class="menu"
a href="#" class="title_Menu"素 菜/a
a href="#" class="body_menu"素菜1/a
a href="#" class="body_menu"素菜2/a
a href="#" class="body_menu"素菜3/a
a href="#" class="body_menu"素菜4/a
a href="#" class="body_menu"素菜5/a
/div
div class="menu"
a href="#" class="title_Menu"炖 菜/a
a href="#" class="body_menu"炖菜1/a
a href="#" class="body_menu"炖菜2/a
a href="#" class="body_menu"炖菜3/a
a href="#" class="body_menu"炖菜4/a
a href="#" class="body_menu"炖菜5/a
/div
div class="menu"
a href="#" class="title_Menu"凉 菜/a
a href="#" class="body_menu"凉菜1/a
a href="#" class="body_menu"凉菜2/a
a href="#" class="body_menu"凉菜3/a
a href="#" class="body_menu"凉菜4/a
a href="#" class="body_menu"凉菜5/a
/div
/body
试试这个，我刚写的
html显示隐藏div
div的visibility可以控制div的显示和隐藏，但是隐藏后页面显示空白:
1
2
3
style="visibility:none;"
document，getElementById("typediv1")，style，visibility="hidden";//隐藏
document，getElementById("typediv1")，style，visibility="visible";//显示
通过设置display属性可以使div隐藏后释放占用的页面空间，如下
1
2
3
style="display:none;"
document，getElementById("typediv1")，style，display="none";//隐藏
document，getElementById("typediv1")，style，display="";//显
$('#h'），click(function(){//点击隐藏，建议把td的id换成class，这样不管几个td几个tr都能用
if($('#td1')，text()==""){
$('#td1')，parent('tr')，hide()
}
});
显示
$('#s'），click(function(){
$('tr')，show()
});
代码性能不好，可以自己去完善
拓展资料
用tbody隐藏吧div和table不好交叉着用
table
trtd显示的/td/tr
tbodystyle="display:none"
trtd隐藏的/td/tr
trtd隐藏的/td/tr
/tbody
trtd显示的/td/tr
/table
在HTML里，当我鼠标移到一个div里 就显示一个隐藏的子div 并且鼠标移到哪 子div就跟到哪！求大神指教
一个父div，里面嵌一个子div。
开始的时候将子div隐藏，即：子div.syle.display="none";
在父div添加onmouseover事件处理，将子div.style.display改成block。
对document.body添加onmousemove事件，通过event.clientX和event.clientY来获取鼠标的位置，然后更新子div的位置为鼠标的位置。
html怎么用a标签显示隐藏的div？
script?type="text/javascript"
?window.onload=function(){
var?div1?=?document.getElementById("div1");??
function?A(){div1.style.display="block"}
?}
div隐藏和显示
方法：打开html开发软件，新建一个html文件，在html文件上创建一个button按钮，然后给这个按钮设置一个id，在案例中把按钮的id设置为show。
然后创建一个隐藏的div，把需要隐藏的内容写到这个div上，然后给这个div设置一个id，在案例中设置案例的id为hide。给div设置隐藏的样式。在title标签后面为id为hide设置样式display:none,这个样id为hide的div就会被隐藏掉了。
写一段JS代码,来改变div的display属性为'none',要显示就为空，比较简单的实现.style.display就是控制层隐藏或显示的属性.
DIV是层叠样式表中的定位技术，全称DIVision，即为划分。有时可以称其为图层。DIV在编程中又叫做整除，即只得商的整数。 DIV元素是用来为HTML（标准通用标记语言下的一个应用）文档内大块（block-level）的内容提供结构和背景的元素。