Question

我目前正在使用show和hide功能进行jquery幻灯片放映，一般来说它的工作非常好。我无法弄清楚的是如何在第一张图片滑出的同时滑动图像。它只是等待第一个图像在下一个图像滑动之前滑出。我想要的是图像在其他图像滑出的同时滑动，而不是图像滑动，必须等待第一张图像完成滑动。

感觉就像我在某个地方犯了一个错误..

HTML

<div class="slider">
        <a href="https://google.com"><img id="1" src="bilder/partner.jpg" type="jpg/png">
        <a href="https://msn.com"><img id="2" src="bilder/värmeplatta.jpg" type="jpg/png">
        <a href="https://twitter.com"><img id="3" src="bilder/Img3.jpg" type="jpg/png">
    </div>

CSS

.slider
        {
            width:600px;
            height:300px;
            overflow:hidden;
            margin: auto;
            background-color:white;
            background-image:url(LoadingLogo.gif);
            background-size:50px 50px;
            background-position:center;
            background-repeat:no-repeat;
            border:2px solid;
        }
        .slider img
        {
            width:600px;
            height:300px;
            display:none;
        }

的Javascript

 function Slider()
                {
                    $("#1").show("slide",{direction:'right'},800);
                    $("#1").delay(4500).hide("slide",{direction:'left'},800);

                    var sc=$(".slider img").size();
                    var count=2;

                    setInterval(function()
                    {
                        $("#"+count).show("slide",{direction:'right'},800);
                        $("#"+count).delay(4500).hide("slide",{direction:'left'},800);

                        if(count==sc)
                            count=1;
                        else
                            count=count+1;  
                    },6100)
                }

Answer 1

我无法创建小提琴，但尝试使用此代码而不是提供：

function Slider() {

$("#1").show("slide",{direction:'right'},800);

var slideCount = $('.slider').find('img').length,
    prevSlide = 1,
    activeSlide = 2;

    setInterval(function() {

        $('#' + prevSlide ).hide('slide',{direction:'left'},800);

        $('#' + activeSlide ).show('slide',{direction:'right'},800);

        activeSlide++;
        prevSlide = activeSlide - 1;

        if( activeSlide === slideCount )
            activeSlide = 1;

        if( prevSlide === 0 )
            prevSlide = slideCount;

   },6100)
}

幻灯片放映，将图像滑入其他幻灯片中

1 个答案: