gpt4 book ai didi

javascript - 如何让 div 去原来隐藏的 div 所在的位置?

转载 作者:行者123 更新时间:2023-11-28 00:13:08 26 4
gpt4 key购买 nike

http://jsfiddle.net/joshr2d2/zU2YH/

当我点击“显示菜单”时,它工作正常并显示菜单,但我想让菜单显示得更高并显示“显示菜单”消失的位置。如果可以,我将如何实现这一点?

<!DOCTYPE html>
<html>

<head>

<link rel="stylesheet" type="text/css" href="http://youngbaptistchurch.tk/css/buttonstyle.css" media="screen" />
<script language=javascript type='text/javascript'>
function hideDiv(pass) {
var divs = document.getElementsByTagName('div');
for(i=0;i<divs.length;i++){
if(divs[i].id.match(pass)){//if they are 'see' divs
if (document.getElementById) // DOM3 = IE5, NS6
divs[i].style.visibility="hidden";// show/hide
else
if (document.layers) // Netscape 4
document.layers[divs[i]].display = 'hidden';
else // IE 4
document.all.hideShow.divs[i].visibility = 'hidden';
}
}
}

function showDiv(pass) {
var divs = document.getElementsByTagName('div');
for(i=0;i<divs.length;i++){
if(divs[i].id.match(pass)){
if (document.getElementById)
divs[i].style.visibility="visible";
else
if (document.layers) // Netscape 4
document.layers[divs[i]].display = 'visible';
else // IE 4
document.all.hideShow.divs[i].visibility = 'visible';
}
}
}
</script>
<style type="text/css">
a:hover{
color:#ffffff
}
</style>

<script language="javascript">
<!--
var state = 'none';

function showhide(layer_ref) {

if (state == 'block') {
state = 'none';
}
else {
state = 'block';
}
if (document.all) { //IS IE 4 or 5 (or 6 beta)
eval( "document.all." + layer_ref + ".style.display = state");
}
if (document.layers) { //IS NETSCAPE 4 or below
document.layers[layer_ref].display = state;
}
if (document.getElementById &&!document.all) {
hza = document.getElementById(layer_ref);
hza.style.display = state;
}
}
//-->
</script>

<link rel="stylesheet" type="text/css" href="http://youngbaptistchurch.tk/alt2/style.css" media="screen" />

</head>
<body>

<div style="position:fixed;">
</div>
<font face="Arial">
<center>
<div id="hide">
<a href="javascript:hideDiv('hide')" onclick="showhide('menu');" class="button big transition">Show menu</a>
</div>
<div id="menu" style="display: none;position:relative;">
<a href="javascript:showDiv('hide')" onclick="showhide('menu');" class="button big transition">Hide menu</a><br />
<br />
<a target="_parent" href="test.html" class="button big transition">Option 1</a>
<br />

<a target="_parent" href="test.html" class="button big transition">Option 2</a>

<br />

<a target="_parent" href="test.html" class="button big transition">Option 3</a>
<br />


<a target="_parent" href="test.html" class="button big transition">Option 4</a>
<br />

<a target="_parent" href="test.html" class="button big transition">Option 5</a>
<br />

<a target="_parent" href="test.html" class="button big transition">Option 6</a>
<br />

<a target="_parent" href="test.html" class="button big transition">Option 7</a>
<br />

<a target="_parent" href="test.html" class="button big transition">Option 8</a>

</center>
</div>
</font>
</body>

</html>​

最佳答案

你可以使用 JQuery

<div id="toggleMenu" onclick="function(){
if ($("#toggleMenu").html() == "Show Menu") {
$("#toggleMenu").html("Hide Menu");
//TODO logic
} else if ($("#toggleMenu").html() == "Hide Menu") {
$("#toggleMenu").html("Show Menu");
//TODO logic
}
}">Show Menu</div>

但是有很多方法可以做到这一点,希望对您有所帮助

关于javascript - 如何让 div 去原来隐藏的 div 所在的位置?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14000707/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com