Jquery повороты с условием

171

21 марта 2018, 04:21

Нужно чтобы rotate не переваливал за 360deg и при этом чтобы блок не вертелся в обратную сторону...

Пробывал реализовать вот так

$('.trub').click(function(){
    var number = true;
    var i = parseInt($(this).attr("data-deg"))+90;
    $(this).css("-webkit-transform","rotate("+i+"deg)");
    $(this).css("transition",".5s");
    $(this).attr("data-deg",i);
    // if (i > 270) {
    //          $(this).attr("data-deg","0");
    //   }
    var this1 = $(this);
    if (i == 360) {
        setTimeout(function(this1) {
                $(this1).css('transition', '0');
                $(this1).css("-webkit-transform","rotate(0deg)");

        },1000);
    }

i = текущий градус поворота this = блок который надо повернуть

тут описано - если поворот равен 360 ждем 1 секунду и переопределяем свойства css

А вот не работает( Помогите чем сможете.

Answer 1

У вас внутри таймаута this1 будет undefined, тк вы его не передали и переобъявили.

$('.trub').click(function() { 
 
  var number = true; 
 
  var i = parseInt($(this).attr("data-deg")) + 90; 
  $(this).css("-webkit-transform", "rotate(" + i + "deg)"); 
 
  $(this).css("transition", "0.5s"); 
 
  $(this).attr("data-deg", i); 
 
  if (i == 360) { 
    setTimeout(function(elm) { 
      $(elm).css('transition', 'none'); 
      $(elm).css("-webkit-transform", "rotate(0deg)"); 
    }, 1000, this); 
  } 
});

.trub { 
  background: red; 
  width: 50px; 
  height: 50px; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="trub" data-deg="270"></div>

Answer 2

Попробуйте анимацию удалить так

$(this1).css('transition', 'unset');

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

ajax отправить json и вернуть результат

Собираю с экрана все загруженные имена и возраста, собираю их в json и отправляю на сервер:

214

jQuery

Подгрузить JS после AJAX

Есть страницаНа странице имеется блок с классом content - здесь подгружается AJAX содержимое

188

jQuery

ошибка при использовании query

вот на такой пустячок

178

jQuery

не отправляются данные из formData

Не первый раз обращаюсь к formData уже, и каждый раз не получается, решил еще раз, ума не приложу, что сделал не так:

202