Сделай так, чтобы div упал со страницы

Question

Так что я уже давно играю с jQuery и пытаюсь заставить эффект работать правильно. У меня есть основной квадратный div в середине страницы, и когда кто-то нажимает на ссылку, я хочу, чтобы окно выглядело, как будто оно падает со страницы и исчезает, открывая новую страницу за ним. Я играл с плагином, но я могу получить то, что хочу работать. По сути, у меня увеличено верхнее поле div или просто верхнее расстояние до большого числа. Тем не менее, это просто делает div падением, но также расширяет мою страницу, и это намного ниже на странице. Я хочу, чтобы div выпал из сайта и не менял размеры сайта. Кто-нибудь знает, как это сделать?

Спасибо! Дэнни

Answer 1

Чтобы предотвратить изменение размеров страницы при нажатии на ссылку, добавьте переполнение: скрыто в свойствах CSS вашего контейнера div. также убедитесь, что вы скрываете div, когда анимация заканчивается.

$('a').click(function(){
   $('#thediv').parent().css('overflow','hidden');
   $('#thediv').animate({'top': '+=500px', opacity: 0},function(){
     $(this).hide();
   });
});