Проблемы со слайд-эффектом пользовательского интерфейса jQuery

Я переделываю веб-сайт своей компании, и мы собираемся использовать довольно много эффектов с помощью jQuery, Flash и т. д. До сих пор у меня не было особых проблем с этим, но продолжают возникать две небольшие проблемы, и я не имел ничего, кроме успеха после того, как спросил людей здесь, так что вот:

Рассматриваемая страница разработки: (URL удален)

Первый выпуск

Нажмите на зеленую стрелку в верхней части навигации в разделе «Результаты». Это должно выдвигать меню справа налево. Он ведет себя так, как должен в Firefox, но IE и Safari начинают анимацию слайда влево с середины страницы, а затем перемещают меню туда, где оно должно быть. Я понятия не имею, почему это делается, поскольку само меню абсолютно позиционировано в CSS. Другая проблема заключается в том, что когда меню открыто и вы пытаетесь закрыть его (используя стрелку того же цвета), оно переходит, как и должно быть в Firefox, но затем снова появляется после завершения перехода. В IE и Safari меню исчезает навсегда, но анимация снова начинается с середины страницы.

Второй (вроде) выпуск

Если эту штуку со слайдом можно проработать, я хотел бы применить аналогичный эффект к нижним сегментам, которые скользят вверх и вниз, когда вы нажимаете на серую стрелку под ними. В настоящее время я взламываю функцию .animate в jQuery, чтобы сначала увеличить высоту, а затем применить отрицательное поле, например:

$('#footer-bucket1')
    .animate({ height: '392px' }, 300)
    .animate({ marginTop: '-306px'}, 300)
    .addClass('bucket-open');

Когда я применил к нему переход слайдом вверх, я увидел, что поле становится больше, но в нисходящем направлении от страницы (к которой применено переполнение: скрыто). Есть ли способ указать, что поле буквально сдвигается вверх, чтобы показать содержимое, как это происходит сейчас? Заранее спасибо!


person Andrew    schedule 19.11.2009    source источник


Ответы (1)


Для начала я бы дал всем img элементам фиксированные width, а height и display им inline, а затем посмотрел дальше.

А еще лучше было бы использовать их как css background-image.

person BalusC    schedule 19.11.2009