Показать сообщение отдельно
  #1 (permalink)  
Старый 28.10.2015, 18:18
Аспирант
Отправить личное сообщение для optron Посмотреть профиль Найти все сообщения от optron
 
Регистрация: 03.12.2013
Сообщений: 35

Изменения высоты блока при наведении курсора
Всем добрый вечер. Помогите решить проблему с дерганьем блоков при наведении мыши.
<div id="popup">
     <div class="on">Блок #1</div>
     <div class="on">Блок #2</div>
     <div class="on">Блок #3</div>
     <div class="on">Блок #4</div>
     <div class="on">Блок #5</div>
     <div class="on">Блок #6</div>
     <div class="on">Блок #7</div>
     <div class="on">Блок #8</div>
     <div class="on">Блок #9</div>
     <div class="on">Блок #10</div>
</div>

var speed=150,
    originalHeight=30,
    hoverHeight=50;

$(".on").hover(function(){
  $(this).stop().animate({height:hoverHeight},speed);
},function(){
	$(this).stop().animate({height:originalHeight},speed);

	
	})


Рабочий пример можно посмотреть здесь - https://jsfiddle.net/7pgeodrm/
Если провести медленно курсором через все блоки, то работает более менее нормально. Но если чуть быстрее то начинает дергать все блоки. Как это можно исправить или чуть приглушить?
Ответить с цитированием