Масштабирование элементов вверх с Scriptaculous

Question

Я создаю небольшой пункт меню, используя Prototype/Scriptaculous.

В небольшом тесте, который у меня есть, используется Effect.Scale для элемента меню. Я хотел бы, чтобы элемент масштабировался вверх и нажимал на него другой элемент, когда вы наводите курсор на элемент меню.

У меня установлен ul.nav на определенную высоту, но масштабируемый элемент, по-видимому, расположен абсолютно так, что его удаляют из потока и масштабируют вниз за пределами коробки.

Есть ли способ сделать это, или я собираюсь сделать это неправильно? Вот страница: УДАЛИТЬ, -invalid URL (http://krd/krd-design.net)

CSS-:

.menuitem { 
border: 1px solid black; 
width: 90px; 

}

.lift { 
display: block; 
background-color: gray; 
width: 90px; 
height: 1px; 

}

.nav { 
border-bottom: 1px solid black; 
height: 60px; 

}

Javascript:

$$('.menuitem').each(function(s){ 
if($(s).down(1).tagName == 'SPAN' && $(s).down(1).className == 'lift') { 
    var lift = $(s).down(1); 
    $(s).observe('mouseenter', function() { 
     new Effect.Scale(lift, 120, { 
      scaleX: false, 
      scaleY: true, 
      scaleContent: false, 
      scaleMode: { originalHeight: 100 }, 
      scaleFrom: 1 
     }) 
    }); 
} 

})

Спасибо! Rich

Answer 1

У меня всегда есть больше успеха с Effect.Morph, чем Effect.Scale. Это дает вам гораздо более тонкий контроль.