var flag = 0/1 (default=1)
J'ai essayé de le faire avec setTimeout / setInterval mais j'ai du mal à les combiner avec des boucles.
Voici un code qui clignote depuis un autre site:
<html> <head> <script type="text/javascript"> function init() { window.setInterval(blink,1000); } function blink() { var elm = document.getElementById('blinkDiv'); if (elm.style.color == "#ff0000") elm.style.color = "#ffffff"; else elm.style.color = "#ff0000"; } </script> </head> <body onload="init();" style="background-color: #ffffff;"> <div id="blinkDiv" style="color: #ff0000;">some text</div> </body> </html>
Essaye ça:
<script type="text/javascript"> var checkIntervalId = null; var blinkIntervalId = null; var flag = 1; var elm = document.getElementById('blinkDiv'); function init() { checkIntervalId = window.setInterval(check,30000); } function check() { clearInterval(blinkIntervalId); if (flag==0) { blinkIntervalId = window.setInterval(blink,1000); } } function blink() { if (elm.style.color == "#ff0000") elm.style.color = "#ffffff"; else elm.style.color = "#ff0000"; } </script>
Si vous modifiez la valeur du flag
par des fonctions externes, vous devez quitter l'intervalle pour vérifier s'il a changé ou non. Vous pouvez changer cet intervalle à 5 secondes pour l'ex. Afin de détecter plus rapidement les changements.
L'autre façon est de changer le flag
non directement mais par la fonction setter pour ex. setFlag(1)
et à l'intérieur de cette fonction, vous pouvez définir et désactiver l'intervalle.
Peut-être quelque chose comme ça:
function init() { //start timeout to see if flag has changed in 30 seconds window.setTimeout(checkState,30000); } var blinkIntervalID; function checkState() { if(flag==0) { // if flag is 0 then start the blinking interval blinkIntervalID = window.setInterval(blink,1000); } else { //else clear the blinking interval and set the text to normal state window.clearInterval(blinkIntervalID); stopBlink() } // Start timeout again to check in 30 seconds if flag has changed window.setTimeout(checkState,30000); } function blink() { var elm = document.getElementById('blinkDiv'); if (elm.style.color == "#ff0000") { elm.style.color = "#ffffff"; } else { elm.style.color = "#ff0000"; } } function stopBlink(){ var elm = document.getElementById('blinkDiv'); elm.style.color = "#ffffff"; }
Vous pouvez utiliser la montre (non standard) (prise en charge dans Firefox) ou cette version de navigateur (prise en charge dans tous les navigateurs récents) pour surveiller les modifications apportées à votre drapeau:
var flag = {value: 1}; flag.watch("value", function(id, oldval, newval) { if (newval === 0) blink(); else stopBlink(); });
La fonction passée à watch
sera exécutée chaque fois que le flag.value
, donc il n'est pas nécessaire de la surveiller avec les délais. (Bien sûr, si l'attente de 30 secondes est une exigence difficile, alors vous revenez à setTimeout
ou vous devriez suivre le temps écoulé depuis que le drapeau a changé pour la dernière fois.)
Merci pour vos réponses, je les essayerai. C'est mon propre essai qui semble fonctionner correctement:
<script type="text/javascript"> function controller(){ if(!f) setTimeout("blink();", 1000); else if(f) setTimeout("controller();", 30000); } function blink(){ var elm = document.getElementById('alert'); if (elm.style.color == "#ff0000") elm.style.color = "#ffffff"; else elm.style.color = "#ff0000"; controller(); } </script>