Comment créer un arrière-plan auto changement dans jquery

je voulais changer l'arrière-plan en boucle automatiquement à l'aideComment créer un arrière-plan auto changement dans jquery

J'ai essayé de créer un tableau qui contient mes codes couleurs préférées, et les appeler par l'indice

<!DOCTYPE html> 
<html> 
<head> 
    <title>Happy Diwali</title> 
    <link href="Index.css" rel="stylesheet"> 
    <link href="greeting.css" rel="stylesheet"> 
    <script src="greeting.js"></script> 
    <script src = "https://cdnjs.cloudflare.com/ajax/libs/react/16.0.0/umd/react.production.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 

</head> 
<body> 
    <div style="height: 700px; width: 100%; border-radius: 4%; background-color: gray;animation-name: magic;animation-iteration-count: infinite;animation-duration: 4s;"></div> 
    <script> 
    var a = ["#116bc4", "#e5109b", "#bfab12", "#000000"]; 

    $(document).ready(function() { 

     var i; 
     for (i = 0; i < 4; i = i + 1) 
     $('div').animate({background-color : a[i]} , 2000); 
    }); 
    </script> 
    </body> 
</html>

Dites-moi ce que je fais mal

Source

2017-10-18 Hritik rai

Un moyen facile de le faire serait d'utiliser des images clés CSS.

@keyframes bg-animation { 
    0% { 
     background: #116bc4; 
    } 
    25% { 
     background: #e5109b; 
    } 
    50% { 
     background: #bfab12; 
    } 
    75% { 
     background: #000000; 
    } 
} 

.div { 
    animation: bg-animation 5s infinite linear alternate; 
}

Source

2017-10-18 08:55:40 Conor

vous devez inclure également jquery ui pour atteindre cet

var a = ["#116bc4", "#e5109b", "#bfab12", "#000000"]; 
 

 
$(document).ready(function() { 
 
    var i; 
 
    for (i = 0; i < 4; i++) 
 
    { 
 
     $('div').animate({backgroundColor : a[i]} , 2000); 
 
    } 
 
});

<script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 
<div style="height:200px;width:200px"> 
 
</div>

Source

2017-10-18 09:01:12

cela ne fonctionne pas -_- mec désolé. –

vérifier l'extrait de code qu'il fonctionne pour moi –

quel est le problème que vous rencontrez? –

Comment créer un arrière-plan auto changement dans jquery

Répondre

Questions connexes