javascript - js控制div隐藏显示。

问题描述

问 题

function shubiaoin(){
    document.getElementById("navbar1").style.visibility="visible";
}
function shubiaoout(){
    document.getElementById("navbar1").style.visibility="hidden";
}

<div id="navbar1" onmouseover="shubiaoin()" onmouseout="shubiaoout()"></div>

js控制div的隐显，但是该div最开始就是隐藏的，这js脚本就不能被触发。但是我查文档说visibility:hidden可以隐藏某个元素，但隐藏的元素仍需占用与未隐藏之前一样的空间。也就是说，该元素虽然被隐藏了，但仍然会影响布局。但是没有效果。然后我就换了透明度控制，但是这样可以吗？

解决方案

你这个具体可以改一下触发的元素
可以外面再套一个div
然后用外面的div来控制里面#navbar1这个div的显示和隐藏

function shubiaoin(){
    document.getElementById("navbar1").style.visibility="visible";
}
function shubiaoout(){
    document.getElementById("navbar1").style.visibility="hidden";
}

<div onmouseover="shubiaoin()" onmouseout="shubiaoout()"><div id="navbar1" ></div></div>

这篇关于javascript - js控制div隐藏显示。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！