JQuery - нежелателен прыжок эффект (это часто происходит, и я не понимаю, почему)

Question

В коде выше мы:

1) Нажмите на Categoria А, а затем, 2) нажмите на одну из смелых названий которые появляются.

Вы заметите, что, расширяя вместо того, чтобы движение было плавным, оно скачет ближе к концу процесса показа. (Кажется, что когда он находит <p>, он прыгает);

В чем может быть причина такого поведения?

Вот его соответствующий код: Код:

$('#btCategoriaA').click(function() { 
      $('#btCategoriaA').toggleClass('selecionado'); 
      $('#listaCategoriaA').slideToggle('slow', function() { 
      }); 
     }); 


     $('#btCategoriaB').click(function() { 
      $('#btCategoriaB').toggleClass('selecionado'); 
      $('#listaCategoriaB').slideToggle('slow', function() { 
      }); 
     }); 

     $('#btCategoriaC').click(function() { 
      $('#btCategoriaC').toggleClass('selecionado'); 
      $('#listaCategoriaC').slideToggle('slow', function() { 
      }); 
     }); 



     function mostraDesafio(num){ 
      $('#detalheDesafio'+num).slideToggle('slow'); 
     } 

Должен ли я предоставить более подробную информацию, пожалуйста, дайте мне знать об этом.

K. С уважением, MEM

Answer 1

.detalheDesafio Дайте элементу определенную ширину в CSS. Это должно исправить это.

.detalheDesafio { 
    width: 308px; 
} 

Я не помню, почему это необходимо, но метод .slideToggle() требует каким-то образом.

Answer 2

Что работало для меня было удалить верхние поля верхнего элемента < p> в элементе, который я пытался использовать .slideToggle(). Это устранило ошибку прыжка в конце.

Другие хорошие предложения по поводу этой ошибки на: http://api.jquery.com/slideToggle/