error with setInterval

Question

error with setInterval

Navigation

#1 by (2 votes)

0

I'm using a jquery api that rotates the images but I have a question about how to stop a setInterval with the hover function of javascript when hovering over the content the interval is executed but I need to remove the mouse interval stop I do not know how to stop it hopefully and you can help me here my code

this is the image that rotates with the interval

<img id="sincroimg" src="img/flechas-actualizar.png" width="30px" height="30px">

and this is my js file

$(document).ready(function(){

$("#sincroimg").hover(function(){

  var angle = 0;//definimos la variable angle igual a 0
  var inter=setInterval(function(){
    angle+=3;
  $("#sincroimg").rotate(angle);


  },1);

 },function(){ 


       clearInterval(inter); 



     })





})

when executing this code what it does is that the image begins to rotate well but when removing the maouse it does not stop and when I pass the mouse over again what it does is that it rotates more and more and faster some help for please

jquery

asked by andy gibbs 12.07.2018 в 02:56

source

1 answer

Send data by POST from php using cURL? Run .class from console

score 2 · Accepted Answer

jQuery.fn.rotate = function(degrees) {
    $(this).css({'transform' : 'rotate('+ degrees +'deg)'});
    return $(this);
};

$(document).ready(function(){
var inter;
$("#sincroimg").hover(function(){
  var angle = 0;//definimos la variable angle igual a 0
  inter=setInterval(function(){
    angle+=3;
  $("#sincroimg").rotate(angle);
  },1);

 },function(){ 
       clearInterval(inter); 
     })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="https://wakyma.com/blog/wp-content/uploads/2017/10/Tipos-de-diarrea-en-gatos-y-su-tratamiento-770x460." width="200" height="200" id="sincroimg">

Take out the variable inter and put it in a more 'general' scope.

The spin function was taken from Here I hope I help you