Jquery Cycle() not working

Jquery Cycle() not working

本文关键字:not working Cycle Jquery      更新时间:2023-09-26

我正在学习Jquery,我试图做一个简单的SlideShow,但什么也没发生…

我的HTML

    <!doctype html>
<html lang="en">
<head>

    <link rel="stylesheet" type="text/css" href="css/Style.css">
    <meta charset="UTF-8">
    <title>SlideShow</title>
</head>

<body>
    <div id="slides">       
        <img src="imgs/1.jpg">
        <img src="imgs/2.jpg">
        <img src="imgs/3.jpg">
    </div>

    <script type="text/javascript">
        $(function(){
            $("#slides").cycle({
                fx: 'fade',
                speed:2000,
                timeout:4000,
            });
        })
    </script>

    <script type="text/javascript" src="js/Jquery.js"></script>
    <script type="text/javascript" src="js/Cycle.js"></script>  

</body>
</html>

我的Css:

*{
    margin: 0;
    padding: 0;
}
#slides{
    width: 1024px;
    height: 768px;
    margin: 0 auto;
    overflow: hidden;
}

我也试过改变,这:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

:

<script src="js/jquery-1.11.0.js"></script>

什么…

您需要在Cycle插件之前包含jQuery,因此在这里颠倒脚本的顺序:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="js/Cycle.js"></script>

此外,最好在Javascript之前包括CSS,以及在关闭</body>标记之前将Javascript放在页面底部。