div隐藏和显示

Posted 2023-05-04

点击按扭后显示DIV,当然这个DIV 就显示在按扭旁边,当鼠标移动到DIV上时无变化,当鼠标移出DIV的时候,让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）的内容提供结构和背景的元素。

参考技术A 用《巨龙效果图自动切片生成Div+Css工具》吧，智能地自动切片并生成标准的可兼容的div+cs
只需要导入效果图，拉框线就可以生成标准的兼容性的DIV+CSS，是网页制作，网页切片的最佳工具。
可以下载去试用一下
www.guanlian8.com 参考技术B 其实要制作一个网页是很简单的，告诉你一个偷懒的方法吧，到用www点guanlian8点com去下载《巨龙效果图自动切片生成Div+Css工具》吧，你的问题也能解决哦，智能地自动切片并生成标准的可
兼容的div+cs
只需要导入效果图，拉框线就可以生成标准的兼容性的DIV+CSS，高级版本还能智动生成后台，带数据库。是网页制作，网页切片的最佳工具。 参考技术C 一般是DIV排版时是用display:none;来隐藏;
display:inline来实现显示 参考技术D 写一段JS代码,来改变div的display属性为'none',要显示就为空.

求一个JS控制DIV显示和隐藏

求一个JS控制DIV显示和隐藏，就是点一下A锚点，然后A锚点下面的DIV就display:none;隐藏起来，再点一下A锚点，DIV就display:blcak;显示出来。

<a href="#" onclic="fun();return false;">显示或隐藏</a>
<div id="show_hide">这是一个div</div>
<script type="text/javascript">
function fun()
    var div = document.getElementById('show_hide');
    if(div.style.display=='block')
        div.style.display='none';
    else
        div.style.display='block'; 
    

</script>

 document.getElementById会根据id选择div；

如果使用jq和css3会有更好的效果，有兴趣可以百度一下相关资料。

追问

为撒，我按你这个代码，测试没任何反应？

参考技术A 比如说div的<div id='box'> ...... </div>
可以在<a href="javascript:operatorDiv('box');" id="btn">显示或隐藏DIV</a>

<script type="text/javascript">
function operatorDiv(id)
var div = document.getElementById(id);

div.style.display = (div.style.display == "none") ? "block" : "none";

</script>

注：JS一定要放到A标签或DIV之前，
==============================================================
如果用jQuery的话就更方便了；
比如说div的<div id='box'> ...... </div>
可以在<a id="btn">显示或隐藏DIV</a>
<script type="text/javascript">
$(document).ready(function()
$("#btn").click(function()
$("#box").toggle();

);

);

</script> 参考技术B document.getElementById('a').click=function()
var div= document.getElementById('div');
if(div.style.display=='block')
div.style.display='none';
else
div.style.display='block';



追问

一个页面有多个这种a标签对应多个div这样会冲突不？

追答

会！建议用jquery

追问

我做的测试不生效，不知道什么原因，能不能帮我看一下。
地址是：http://www.cdncsj.com/cs.html
找到原因了，网友推荐那个代码里，onclick少了一个k，一直没发现，细节坑人啊。

本回答被提问者采纳