“Botón de intervalo de pausa JavaScript” Código de respuesta

Botón de intervalo de pausa JavaScript

var i = 0;
this.setInterval(function() {
  if(!$('#counter').hasClass('pauseInterval')) { //only run if it hasn't got this class 'pauseInterval'
    console.log('Counting...');
    $('#counter').html(i++); //just for explaining and showing
  } else {
    console.log('Stopped counting');
  }
}, 500);

/* In this example, I'm adding a class on mouseover and remove it again on mouseleave. You can of course do pretty much whatever you like */
$('#counter').hover(function() { //mouse enter
    $(this).addClass('pauseInterval');
  },function() { //mouse leave
    $(this).removeClass('pauseInterval');
  }
);

/* Other example */
$('#pauseInterval').click(function() {
  $('#counter').toggleClass('pauseInterval');
});
Strange Snake

Botón de intervalo de pausa JavaScript

<!-- you'll need jQuery for this. If you really want a vanilla version, ask -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<p id="counter"> </p>
<button id="pauseInterval">Pause</button></p>
 Run code snippet
Strange Snake

Botón de intervalo de pausa JavaScript

body {
  background-color: #eee;
  font-family: Calibri, Arial, sans-serif;
}
#counter {
  width: 50%;
  background: #ddd;
  border: 2px solid #009afd;
  border-radius: 5px;
  padding: 5px;
  text-align: center;
  transition: .3s;
  margin: 0 auto;
}
#counter.pauseInterval {
  border-color: red;  
}
Strange Snake

Respuestas similares a “Botón de intervalo de pausa JavaScript”

Preguntas similares a “Botón de intervalo de pausa JavaScript”

Más respuestas relacionadas con “Botón de intervalo de pausa JavaScript” en JavaScript

Explore las respuestas de código populares por idioma

Explorar otros lenguajes de código