Как добиться эффекта slideToggle, похожего на кнопку «Новые истории» в Facebook с помощью jQuery? - PullRequest
1 голос
/ 02 ноября 2011

Как вы знаете, не так давно Facebook добавил несколько новых функций. Одной из них была кнопка «Новые истории», которая при нажатии расширяется (с тем, что, как мне кажется, является эффектом slideToggle) и показывает новые истории.


Вот кнопка, о которой я говорю:

FaceBook toogle Button


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

Я пытался найти это в Интернете, но все найденные мной эффекты были обычными эффектами slideToggle, я имею в виду, что они начали показывать div сверху вниз и скользили вниз (вниз) (вот что я имею в виду под обычным контентом http://jsfiddle.net/TwxB4/), где, как использует один фейсбук, начинается с нижней части скрытого элемента div и сортирует слайды до его верхней части (вы поймете, что я имею в виду, если проверите его на фейсбуке).

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


Редактировать: Вот иллюстрация эффекта, который я ищу:

illustration

Ответы [ 3 ]

2 голосов
/ 03 ноября 2011

Этот пример работает так, как вы описали, сначала показывая нижний контент:

http://jsfiddle.net/SBLNn/16/

Также здесь можно посмотреть полный экран:

http://jsfiddle.net/SBLNn/16/embedded/result/

Они также могут сделать это, скрыв переполнение канала, а затем установив отрицательное поле на внутренней обертке подачи, затем, когда вы нажимаете, они просто анимируют это отрицательное поле до 0.

1 голос
/ 02 ноября 2011

Работает ли это для вас http://jsfiddle.net/wb7h6/1/

обновленная версия http://jsfiddle.net/wb7h6/9/ Надеюсь, это то, что вам нужно

0 голосов
/ 02 ноября 2011

Вы хотите slideToggle() Я думаю. Смотрите этот jsFiddle .

...