Анимировать вниз с помощью JS

Question

У меня есть несколько страниц (включая страницу «include» php, в которой содержатся ссылки на мои ссылки. Также у меня есть страница php-страницы нижнего колонтитула.

В принципе, я думал о том, что эта гладкая анимация, где моя «сумка», как я ее называю, оживляет вниз. Это в основном немного более привлекательный тип прямоугольника с шириной 1000 пикселей. Таким образом, всякий раз, когда я нажимаю «Службы», например, он будет медленно перемещаться вниз.

Помимо ссылок на моих страницах, порядок того, что у меня есть сейчас, выглядит следующим образом: у меня есть внешние скрипты, и у меня есть текст на каждой из моих страниц. Так, например, для страницы «Услуги» у меня есть текст, за которым следует «сумка». «Сумка» находится на моей php-странице «include».

Это код, который у меня есть для анимации. У меня есть аналогичный код, который работает над другим проектом, который включает в себя больше кодирования. Но, я полагаю, этот код здесь правильный. Вопрос заключается в том, как я могу это сделать, что этот код запускается перед загрузкой текста другой страницы:

$('#services-fr-2').click(function(){ 
    if ($('#green-pouch-fr').height() == 580) { 
     $('#green-pouch-fr').animate({ 
     'top':'800px', 
     'height':'500' 
     }) 

Другими словами, даже если текст на следующей странице, я должен был бы мешок, чтобы оживить вниз , а затем появится текст.

Answer 1

Функция animate принимает в качестве параметра функцию, которая будет вызываться после завершения анимации.

Если этот вопрос с вопросом, как установить текст только после того, как анимация будет завершена, вы можете сделать это так:

$('#green-pouch-fr').animate({ 
      'top':'800px', 
      'height':'500' 
      }, 
      { 
       complete: function() { 
         $(this).text(pageContent); 
       } 
      } 
); 

Answer 2

Попробуйте что-то вроде:

$.ajax(/* ajax stuff here */).done(function(data){ 
    $('#green-pouch-fr').animate({ 
    top: '800px', 
    height: '500' 
    }, 500, function(){ 
     //run your text data here 
    } 
    }); 
    });