0

我正在尝试使用 JQuery 实现一个简单的图像滑块。这是我的代码：

<p id="Photos">
        <img alt="Image-1" src="../../Images/Image1.png" />
        <img alt="Image-2" src="../../Images/Image-2.png" />
        <img alt="Image-3" src="../../Images/Image-3.png" />
    </p>

<script type="text/javascript">
    $(document).ready(function () {
        SlideImage(1);
    });

    function SlideImage(currentPhoto) {
        var NumberOfPhotos = $('Photos img').length;
        currentPhoto = currentPhoto % NumberOfPhotos;

        $('Photos img').eq(currentPhoto).fadeOut(function () {
            $('Photos img').each(function (i) {
                $(this).css('zIndex', ((NumberOfPhotos - i) + currentPhoto) % NumberOfPhotos
            );
            });

            $(this).show();

            setTimeout(function () { SlideImage(++currentPhoto); }, 3000);
        });
    }
    </script>

首先，滑块不起作用，不断显示单个图像。任何解决此问题的建议都将受到高度赞赏，但更重要的是我需要了解代码中使用的变量“i”的含义，我从哪里获得它的价值以及它的目标是什么？

提前致谢。

4

1 回答 1

0

i 是您在调用“每个”的对象集合中的当前位置的索引。jQuery API很好地解释了这些细节。

在这种情况下，我认为集合本身将为空，因为不是调用

$('Photos img').eq(currentPhoto).fadeOut(function () {

我相信你想用

$('#Photos img').eq(currentPhoto).fadeOut(function () {

因为您试图通过其 ID 值来处理该项目

于 2012-09-20T11:19:24.103 回答