簡體   English   中英

如何在jquery中以5秒的間隔創建類的數組,在dispaly上添加和刪除類切換div

[英]How to create an array of classes in jquery and with a 5 second interval, add and remove class switching div on dispaly

早上好,

我正在嘗試創建一個類數組,間隔為5秒,我想添加和刪除替換當前div的類。 這是針對輪播,此時我當前正在更改背景圖像。 我現在想以相同的方式替換我的描述性文字。 有人可以幫忙嗎?

我當時想檢查當前背景的if語句可以工作。 我如何收到此錯誤:“意外令牌{”

$(document).ready(function(){

/ * HEADERCAROSUEL * /

$(function() {
    var headCarosuel = $(".headCarosuel");
    var backgrounds = new Array(
    "url('./img/backgroundVinny1.jpg')","url('./img/backgroundVinny2.jpg')"
    );
    var current = 0;
    function nextBackground() {
    $(".headCarosuel").css("background", backgrounds[current = ++current % backgrounds.length]);
    setTimeout(nextBackground, 5000);
    }
    setTimeout(nextBackground, 5000);
    $(".headCarosuel").css("background", backgrounds[0]);

if(backgrounds = $("url('./img/backgroundVinny1.jpg')").css() {
    $('.headCarosuelText').removeClass('description2').addClass('description1');
}
else {
    $('.headCarosuelText').removeClass('description1').addClass('description2');
}

});

});

通過您的信息和示例,我了解了以下代碼。 它每5秒鍾更改一次背景圖像和背景類。

$(document).ready(function(){
/* H E A D E R C A R O S U E L */
    var headCarosuel = $(".headCarosuel");
    var backgrounds = new Array(
    "url('https://dummyimage.com/200x100/000/fff&text=vinny1')","url('https://dummyimage.com/200x100/000/fff&text=vinny2')"
    );
    var classes = [ "description1", "description2" ];
    var current = 0;
    function nextBackground() {
      var prevIndex = current;
      current = (current + 1) % backgrounds.length;
      $(".headCarosuel").css("background", backgrounds[current]);
      $(".headCarosuel").removeClass(classes[prevIndex]).addClass(classes[current]);
      setTimeout(nextBackground, 5000);
    }
    nextBackground();
});

您可以在https://codepen.io/mtomas/pen/MQXPGE上對其進行測試

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM