Question

在代码之后，我将链接一个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：

http://jsfiddle.net/eohvutps/

这是我的JSFiddle（代码并没有起作用，所以我一定做错了。）：

enter link description here

Answer 1

您没有将Jquery库包含在您的小提琴中。你有没有加入你的网页？如果没有，这将是你的问题。

我的弹出窗口代码有什么问题？

1 个答案: