2012-01-22 5 views
1

То, что я хочу сделать может быть достигнуто только с помощью:JQuery анимации вниз (100% высоты элемента)

slideDown("fast"); 

Однако, мне не нравится, как это показывает элемент, я хотел бы за это 100% от первоначальной высоты элементов и скатываться вниз. Мне интересно, есть ли простой способ сделать это? Кроме, возможно, изменения маржинального и такового, а затем оживления его в нормальном режиме.

Пример того, что я хочу сделать: http://jsfiddle.net/7dary/1/ Однако я хотел бы, чтобы он просто делать все расчеты автоматически, и не показывать в середине страницы, если это в нижней части страницы и I лично назначьте -200px или что-то в этом.

ответ

4

Решение:

var $element = $("#itemToSlide"); // make sure its visible 
var height = $element.height(); // get the height when its populated 
$element.css({marginTop:height*-1}); // set it to 0 with an overflow hidden 

// trigger the animate now or later in an event 
$element.show().animate({marginTop:0},2200); 

ссылка: http://jsfiddle.net/MattLo/7dary/2/

+0

Спасибо, но вы сказать, что это должно быть видно, а он должен быть невидимым, чтобы начать с, и толкания в вид –

+0

Обновленный, видимый может дать нежелательные проблемы с перекрестным браузером. –

+0

Это тот эффект, который я ищу, а не тот, на котором вы показали пример. http://jsfiddle.net/7dary/1/ Это прекрасно работает, однако я надеялся, что это будет сделано автоматически, и не нужно менять поля самостоятельно, потому что 1: высота будет разной на один экземпляр и 2: большая часть времени -200px будет просто иметь его в середине страницы или что-то в этом роде. –

Смежные вопросы