переменные настройки и настройки jquery

Question

Я пытаюсь создать slideUp divs с переменными «верхними» высотами, так что один div может сдвигать 700 пикселей, а другой (с меньшим содержимым) слайдыUp только 400 пикселей. В настоящее время divs все slideUp на одной высоте. В css нет объявлений div height. Мой скрипт:

$(document).ready(function(){   
      var oldHeight; 
    $('a.menubtn').click(function(){    
      var newHeight; 
      if ($(this.id) == 'work') { 
        newHeight = 700; 
        } 
        else { if ($(this.id) == 'services') { 
         newHeight = 400; 
        } 
        else { if ($(this.id) == 'about') { 
         newHeight = 400; 
        } 
        else { 
         newHeight = 300; 
        } 
        } 
        } 

      if ($('.active').length > 0) { 

       $('.active').removeClass('active').animate({'top': '+=' + oldHeight + 'px'}, '200'); 
       $('div#contents_'+ this.id).addClass('active').animate({'top': '-=' + newHeight + 'px'}, '200'); 
       oldHeight = newHeight; 
       } 
       else 
    $('div#contents_'+ this.id).addClass('active').animate({'top': '-=' + newHeight + 'px'}, '200'); 
       oldHeight = newHeight; 
       } 
    return(false); 
    });    
}) 

TIA.

Answer 1

Ваши заявления if неверны.

Это:

$(this.id) == 'work' // here you're comparing a jQuery object to 'work' 

должно быть:

this.id == 'work'  // here you're comparing the actual ID value to 'work' 

Было бы чище, если вы изменили структуру if заявлений быть таким:

if (this.id == 'work') { 
    newHeight = 700; 
} else if (this.id == 'services') { 
    newHeight = 400; 
} else if (this.id == 'about') { 
    newHeight = 400; 
} else { 
    newHeight = 300; 
}