Error slider gambar tidak lanjut lagi, pas klik before atau after

ERROR NYA, ketika klik after gambar ga slide otomatis lagi

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>

    <div class="main-container">
        <div class="container">
            <div><img src="img/1.jpg"></div>
            <div><img src="img/2.jpg"></div>
            <div><img src="img/3.jpg"></div>
            <div><img src="img/4.jpg"></div>
            <div><img src="img/1.jpg"></div>
        </div>
    </div>

    <button id="before">before</button>
    <button id="after">after</button>

    <script src="jquery.js"></script>
    <script src="main.js"></script>

</body>
</html>
body {
    font-family: Arial, Helvetica, sans-serif;
    width: 70%;
    margin: 30px auto;
}

.main-container {
    width: 400px;
    margin: 0 auto;
    overflow: hidden;
}

.container {
    width: 4000px;
    margin: 0 auto;
}

.container div {
    float: left;
    width: 400px;
}

.container img {
    width: 100%;
}

$(document).ready(function() {

    function slide(num) {
        if ( $('.container').css('marginLeft') == '-1600px') {
            $('.container').css('marginLeft', '0px');
        } else {
            $('.container').animate({marginLeft : num});
        }
    }

    var autoslide = setInterval(function() {
        slide('-=400px');
    }, 2000);

    $('#after').click(function() {
        slide('-=400px');
        clearInterval(autoslide);
    });

    $('#before').click(function() {
        if ( $('.container').css('marginLeft') == '0px') {
            $('.container').css('marginLeft', '-1200px');
        }
        else {
            slide('+=400px');
        clearInterval(autoslide);
        }
    });

});
avatar ahmadsirojuddinkamil
@ahmadsirojuddinkamil

8 Kontribusi 1 Poin

Diperbarui 2 tahun yang lalu

Tanggapan

jangan hanya screenshot, jelaskan di pertanyaan kamu masalahnya apa dan dimana. Untuk menampilkan kode, kamu harus copy-paste dan gunakan tag kode, bukan upload sebagai gambar

1 Jawaban:

<pre>// bukannya di sini :

$(&#039;#after&#039;).click(function() {
    slide(&#039;-=400px&#039;);
    clearInterval(autoslide);
});	

// ada clearInterval yaa ? jadi autoslide nya udah ga berinterval lagi,, // jadinya autoslidenya ga nyala</pre>

avatar yukari06
@yukari06

137 Kontribusi 66 Poin

Dipost 2 tahun yang lalu

Login untuk ikut Jawaban