Question

当我尝试使用此代码时，一切都运行正常。
但是在我将它上传到github页面之后，它非常可怕。

这是代码：

<!DOCTYPE html>
<html>
<head>
    <title>CoffeeTech Slider</title>
    <link href="https://fonts.googleapis.com/css?family=Dancing+Script" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
    <script
  src="https://code.jquery.com/jquery-3.1.1.js"
  integrity="sha256-16cdPddA6VdVInumRGo6IbivbERE8p7CQR3HzTBuELA="
  crossorigin="anonymous"></script>
    <script src="http://malsup.github.io/jquery.cycle.all.js"></script>
</head>
<body>
    <div id="container">
    <h1>CoffeeTech</h1>
        <div class="slider">
            <img src="img/slide1.jpg" width="640" height="426">
            <img src="img/slide2.jpg" width="640" height="426">
            <img src="img/slide3.jpg" width="640" height="426">
            <img src="img/slide4.jpg" width="640" height="426">
            <img src="img/slide5.jpg" width="640" height="426">
        </div>

        <ul id="nav">
            <li id="prev"><a href="#">Previous</a></li>
            <li id="next"><a href="#">Next</a></li>
        </ul>
    </div>

    <script>
    $(document).ready(function(){
        $('.slider').cycle({
            fx: 'turnDown',
            pause: 1,
            prev: '#prev',
            next: '#next'
        });
    });
    </script>
</body>
</html>

Github link
The page it's displaying horribly

Answer 1

@Xufox是对的，我在Firefox的控制台中有一条消息：加载时阻止混合内容 http://malsup.github.io/jquery.cycle.all.js

似乎与您的网页使用https并从http链接加载内容这一事实有关 More about mixed content

jQuery cycly插件无法在线工作

1 个答案: