30 марта 2009
Как сделать красивую галерею портфеля с помощью JQuery анимацию!
Добавил: Махбуб в: разное
Ведение портфолио со вспышкой на вашем сайте стало виде устарела. В эти дни с Быстрее машины и новый браузер поколения действительно может надрать задницу с Javascript и CSS. JQuery имеет очень аккуратный способ иметь дело с некоторыми эффектами. Все анимации исходят из базового метода называют "живой". Это оживляет, подросткам свойств элементов DOM. Для того чтобы сделать длинную историю короткой взглянуть на это.
Итак, вы уже нажали и увидел не так ли? Хорошо, если вы посмотрите на код, это довольно просто.
$ (Документ). Готов (функция () { уаг hover_in_easing = "easeOutExpo"; уаг hover_out_easing = "easeOutBounce"; . $ (". Info_container") show (); $ ("Div.portfolio_div"). Hover (функция () { . $ (Это) найти ("info_container"). Animate ({вверху: "0px"}, {продолжительность: 400, ослабление: hover_in_easing}). }, Функция () { . $ (Это) найти ("info_container"). Animate ({вверху: "100px"}, {продолжительность: 500, ослабление: hover_out_easing}). }); / / 100 пикселей имеет размер маски });
Она использует функцию анимации оживить маску на изображение, которое хранится скрыто позиционирование относительно. А с ослаблением плагин, мы достигаем какой-нибудь классный эффект подпрыгивая при наведении из образа. Вы можете поместить любой HTML внутри элемента DIV info_container тех пор, пока она не выходит за пределы границ. Посмотрите на таблицу стилей, и вы найдете очень gramatical. Вы можете настроить размер, изменив дел классов.
Вдохновение: http://dibusoft.com/portfolio
Последние комментарии