如何使用 javascript 制作幻灯片？

Question

我是 javascript 的初学者。我一直想为我的网站制作幻灯片，但现在已经停滞了一段时间。

我有一些代码可以在这里完美运行：JSfiddle1

// Code In Fiddles
function Divs() {
    var divs= $('#parent div'),
        now = divs.filter(':visible'),
        next = now.next().length ? now.next() : divs.first(),
        speed = 1000;

    now.fadeOut(speed);
    next.fadeIn(speed);
}

$(function () {
    setInterval(Divs, 3400);
});

但这里不多：JSfiddle2

两个小提琴中的代码完全相同，一个有效，另一个无效。

该代码也无法在我的网站上运行，所以我想知道可能是什么问题。

Answer 1

您需要包含 jquery 插件才能使 javascript 正常工作。 Get Jquery Here.

您还可以使用托管库将 jquery 加入您的项目。托管库很棒，因为许多开发人员都在使用它们，这意味着网站浏览者很可能会将它们缓存在浏览器中，从而减少加载时间。

Check out the hosted libraries here

示例库

// post this in the head of you html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

如何使用 javascript 制作幻灯片？

How to make a slideshow with javascript?

html

javascript

css

jquery

slideshow