Вопрос по jquery – Расти из центра анимации с JQuery

9

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

Благодаря помощи Джейми Диксона этот код заработал.

$('#grower').css({
    backgroundColor: '#FFFFFF',
    border: '10px solid #999',
    height: '0px',
    width: '0px',
    color: '#111111',
    fontWeight: 'bold',
    padding: '10px',
    display: 'none',
    position: 'absolute',
    left: $(this).position().left,
    top: $(this).position().top
}).appendTo('#overlay').fadeIn(0).animate({
    position: 'absolute',
    height: '200px',
    width: '600px',
    marginTop: '-120px',
    marginLeft: '-320px',
    display: "",
    top: ((($(parent).height() - $(this).outerHeight()) / 2) + $(parent).scrollTop() + "px"),
    left: ((($(parent).width() - $(this).outerWidth()) / 2) + $(parent).scrollLeft() + "px")
}, 1000);

Ваш Ответ

1   ответ
18

w, передающим значение & quot; scale & quot; в качестве параметра.

 $('#growwer').show("scale",{}, 1000);

Рабочий пример

Чтобы переместить ваш элемент в центр страницы, я создал измененную версию функции jQuery Тони Л, найденную здесь:Использование jQuery для центрирования DIV на экране.

Рабочий пример

Update

Вот рабочий пример двух анимаций, запущенных одновременно:

http://jsfiddle.net/wNXLY/1/

Чтобы заставить это работать, я включил дополнительный параметр вanimate передача функции в:{duration: durationLength, queue: false}

Я сейчас просто смотрю на это. Я сообщу вам, как только разберусь.
У меня тоже есть демо, я добавлю его в свой ответ.
Потрясающие! Это работало отлично. Спасибо за примеры. mrK
Я думаю, что нашел это. Благодаря вашим функциям. Я отправил это в вопросе. mrK
Есть ли способ, чтобы обе анимации происходили одновременно? mrK

Похожие вопросы