在代码之后，我将链接一个 JSFiddle，它显示代码是什么以及它应该做什么。 我正在制作一个弹出窗口并拥有它，以便在弹出窗口可见时它周围的背景逐渐消失。它在 JSFiddle 中有效，但在网页中无效。这是我的代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="stylesheets/jquerystylesheet.js"></script>
<style type="text/css">
html,
body {
height: 100%;
}
.overlay {
position:absolute;
display:none;
/* color with alpha transparency */
background-color: rgba(0, 0, 0, 0.7);
/* stretch to screen edges */
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.popup {
position: absolute;
width: 300px;
height: 150px;
display: none;
background-color: white;
text-align: center;
/* center it ? */
top: 50%;
left: 50%;
margin-left: -150px;
margin-top: -75px;
}
</style>
</head>
<body>
<div class="overlay"></div>
<div class="popup">Some popup text</div>
<p>Some content text (click anywhere to toggle overlay)</p>
</body>
</html>
这里是 jquery:
$("body").click(function() {
$(".overlay").toggle(); // show/hide the overlay
});
这是我从中获得的 JSFiddle:
这是我的 JSFiddle(代码在其中也不起作用，所以我一定是做错了什么。):
最佳答案
您没有在您的 fiddle 中包含 Jquery 库。您是否包含在您的网页中？如果没有，这将是您的问题。
关于javascript - 我的弹出窗口代码有什么问题？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27425414/