Question

我使用了一个名为backstretch的完整页面背景jquery图像插件。在我完成网站制作后，我想将它添加到codepen.io，但整页背景的图像不会显示。

<!doctype html>
  <html>
    <head>
      <meta charset = "utf-8">
      <title>Oregon</title>
      <link href='https://fonts.googleapis.com/css? family=Raleway%7cIndie+Flower' rel='stylesheet' type='text/css'>
     <link rel="stylesheet" href="css/normalize.css">
     <link rel="stylesheet" href="css/styles.css">
   </head>
<body>
    <header>
        <nav>
            <ul>
                <li><a href="index.html">Home</a></li>
                <li><a href="pics.html">Pics</a></li>
                <li><a href="contact.html">Contact</a></li>
            </ul>
        </nav>
    </header>
    <div class="main-content">
        <h1>Vacation In Oregon</h1>
        <a class="oregon" href="http://www.oregon.gov/pages/index.aspx" target="_blank">
            <p>Oregon</p>
        </a>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
    <script src="js/jquery.backstretch.min.js"></script>
    <script>
              $.backstretch("https://devinsabbatical.files.wordpress.com/2012/09/3-mount-jefferson.jpg");
    </script>
</body>

有人可以向我解释如何让图像显示在codepen.io上吗？如果它有助于图像是我的html的最后一部分，以$ .backstrech（“https://devinsabbatical.files.wordpress.com/2012/09/3-mount-jefferson.jpg”）开头;

以下是我的codepen的链接：http://codepen.io/mike316/pen/Vjrjzg

Answer 1

您需要将url添加到脚本，而不是本地路径：

这是你的路线： <script src="js/jquery.backstretch.min.js"></script>

更改为此（在您的codepen源代码上）： <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.4/jquery.backstretch.min.js">

如何让我的图像显示在codepen.io中

1 个答案: