gpt4 book ai didi

jquery - 从链接弹出div

转载 作者:太空宇宙 更新时间:2023-11-04 02:47:16 24 4
gpt4 key购买 nike

我在页面顶部有两个链接。当我单击链接时,我希望它打开一个包含给定信息的弹出框(我可以关闭)。现在,如果我单击该链接,它会将我带到页面上的那个部分,但我无法单击第二个链接,除非我一直滚动回到页面顶部。

这是我目前拥有的:(我输入了点来表示弹出函数之间有代码;基本上相同的 div 框一遍又一遍,只是每个框上的 channel 号不同)

<p style="font-size:16px"> Changed channels: <a href="#001" data-rel="popup">031</a> 

(我删除了第二个链接以避免混淆)

.
.
.
.
.
.

<div id="LayoutDiv3">
<div data-role="popup" id="001">
<div id="Leftbox">001</div>
<div id="chan_logo" style="max-width: 30%"><img src="imgs/chan_logo_01.png" alt="hello"></div>
<div id="chan_title">

<br>
.
.
.
</div>
(please assume the number of div's are all accounted for)

最佳答案

也许是这样的(请考虑分配一个 css 类):

<script>
function openPopup() {
popup = document.getElementById("myPopup");
popup.style.display = "block";
}

function closePopup() {
popup = document.getElementById("myPopup");
popup.style.display = "none";
}
</script>

<style>
#myPopup {
display: none;
position: absolute;
top:50px;
right:50%;
background-color: blue;
height:100px;
width:100px;
}

#myExit {
position: absolute;
right:0px;
text-align: right;
color:white;
background-color: red;
}
</style>

<a href="#" onclick="openPopup(); return false;">Open Popup</a>
<div id="myPopup">
<a href="#" id="myExit" onclick="closePopup();return false">x</a>
Hello There

</div>

其他解决方案:

<html>
<body>


<script>
function openPopup(mydiv) {
popup = document.getElementById("myPopup");
popup.style.display = "block";
myPopupContent = document.getElementById("myPopupContent");
myPopupContent.textContent = document.getElementById(mydiv).textContent;
}

function closePopup() {
popup = document.getElementById("myPopup");
popup.style.display = "none";
}
</script>

<style>
#myPopup {
display: none;
position: absolute;
top:50px;
right:50%;
background-color: blue;
height:100px;
width:100px;
}

#myExit {
position: absolute;
right:0px;
text-align: right;
color:white;
background-color: red;
}
</style>

<div id="myPopup">
<a href="#" id="myExit" onclick="closePopup();return false">x</a>
<div id="myPopupContent"></div>
</div>


<a href="#" id="chan001" onclick="openPopup('chan001'); return false;">Foo</a>
<a href="#" id="chan002" onclick="openPopup('chan002'); return false;">Fii</a>
<a href="#" id="chan003" onclick="openPopup('chan003'); return false;">Faa</a>



</body>
</html>

关于jquery - 从链接弹出div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33674690/

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