Question

这是codecademy.com的一个教训，我发现它非常有用。但是，当我尝试将其粘贴到文本编辑器并在网络上运行时，它无法正常工作。这是代码：

HTML

<!DOCTYPE html>
<html>
    <head>
        <title>Slide Panel</title>
        <script type="text/javascript" src="script.js"></script>
        <link rel="stylesheet" type="text/css" href="stylesheet.css"></link>
        <meta charset="UTF-8">
    </head>
    <body>
        <div class="panel">
        <br />
        <br />
        <p>Now you see me!</p>
        </div>
        <p class="slide"><div class="pull-me">Slide Up/Down</div></p>
    </body>
</html>

CSS

body {
    margin:0 auto;
    padding:0;
    width:200px;
    text-align:center;
}
.pull-me{
    -webkit-box-shadow: 0 0 8px #FFD700;
    -moz-box-shadow: 0 0 8px #FFD700;
    box-shadow: 0 0 8px #FFD700;
    cursor:pointer;
}
.panel {
    background: #ffffbd;
    background-size:90% 90%;
    height:300px;
    display:none;
    font-family:garamond,times-new-roman,serif;
}
.panel p{
    text-align:center;
}
.slide {
    margin:0;
    padding:0;
    border-top:solid 2px #cc0000;
}
.pull-me {
    display:block;
    position:relative;
    right:-25px;
    width:150px;
    height:20px;
    font-family:arial,sans-serif;
    font-size:14px;
    color:#ffffff;
    background:#cc0000;
    text-decoration:none;
    -moz-border-bottom-left-radius:5px;
    -moz-border-bottom-right-radius:5px;
    border-bottom-left-radius:5px;
    border-bottom-right-radius:5px;
}
.pull-me p {
    text-align:center;
}

JQuery的/使用Javascript

$(document).ready(function(){
    $(".pull-me").click(function(){
        $(".panel").slideToggle("slow")
        });
    });

我不是一名专业的网络开发人员，但我想了解更多，因为我喜欢编码。

Answer 1

如果要使用它，必须包含jQuery库。把它放在你之前包含任何使用jQuery的脚本。

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

谢谢你们，我找到了答案。

<script src="http://code.jquery.com/jquery-1.10.1.min.js"> </script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"> </script>

我不知道您需要使用此链接来使您的jQuery工作。这是我第一次使用jQuery。但感谢你们的回应。

当我在网上试用它时，Codecademy的JQuery没有工作

2 个答案: