Не тако давно Flash је био једна од примарних технологија које су коришћене од стране веб дизајнера како би унели интерактивност веб страни.
Од када је представљен iPad, са својим недостатком Flash Player-а, дошло је до убрзаног коришћења технологија које су алтернативе Flash-у, као што су JQuery, Ajax и друге.
Иако је Flash још увек веома користан и моћан алат, који ради одлично у већини случајева, један број ефеката које су дизајнери навикли да праве у Flash-у, могу бити исто тако лако имплементирани и кроз JQuery.
У наставку текста можете погледати 21 онлајн примера који приказују моћ JQuery-ја при креирању напредних ефеката и интерактивност која може бити ривал Flash-у.
Flip! JQuery плагин
Овај демо имитира популарну технику превртања картица која може да ротира елемент 360 степени око своје x или y осе.
JQuery Quicksand плагин
Ово је одличан плагин за сортирање низа елемената/икона на страни са лепим fade-in/fade-out ефектом и ефектима анимације.
ImageFlow
Галерија слика која је слична интерфејсу Apple CoverFlow-а који је постао стандардан у њиховим разним производима и апликацијама.
Креирање интерактивне мапе користећи JQuery уместо Flash-а
Овај демо спаја моћ JQuery-ја са Ajax-ом и прави одличан интефејс.
Slideout савети – JQuery и CSS3
Клик на “+” симбол открива додатне информације са лепим ефектом.
Zoomer галерија
У овом дему ономе што изгледа да је регуларна статичка галерија фотографија је додата интерактивност користећи multi-layer зум ефекат када се мишем пређе преко фотографије.
jQuery Circulate
Демо приказује пуно коришћени Flash ефекат циркулисања слика кроз страну – све урађено кроз jQuery.
Photo Zoom Out Effect
Овај демо изгледа једноставно, али након дубље анализе видећете да ту постоји неколико layer-а који доприносе комплексности zoom-out ефекта.
Sliding боксеви са описима
Овде можемо видети како се могу направити добре транзиције са jQuery-јем, техника која је некада била могућа само у Flash-у.
CSS3 Lightbox галерија
Овај плагин изгледа као да је писан специјално за друштвене медије. Превлачење фотографије на “share box” ће отворити прозор који може бити интерфејс који ће позвати API кроз AJAX и даље омогућити кориснику да шерује фотографију на Flickr-у, Twitter-у, Facebook-у и другим сајтовима.
Пхотосхоот ефекат користећи jQuery и CSS
Овај плагин може бити јако моћан алат за рад са великим сликама када се укомпонује са АЈАX-ом или HTML5 локалним смештањем фајлова.
Навигација са балончићима
Овде девелопер може јако лепо да искористи прелаз боја и анимацију чиме креира веома атрактиван и интерактиван мени.
Навигација са сликом у позадини
Када корисник пређе преко неког дела у главном менију позадинска слика се такође мења. Врло лепо и иновативно у веб девелопмент свету.
AviaSlider
AviaSlider користи транзиције које јако пуно личе на оне које смо имали у Flash-у и на тај начин креира стандарни интерфејс са слајдером.
Slideshow позадина
Анимиране позадине је област где је Flash буквално доминирао. Ево примера где је исто урађено, али кроз jQuery.
Panning Slideshow
Још један јединствено урађен типични slideshow. Аутор је додао и дијегоналну навигацију и тако зачинио интерфејс и направио га још више јединственим.
jqFancyTransitions
Овај плaгин се може користити да прикажете фотографије кроз slideshow са фенси ефектима налик Flash-у.
iCarousel – Хоризонтални слајдер
Још један slideshow који додаје једноставност у креирању јединствених транзиција. Није ни чудо што су изабрани Mac производи за овај демо.
Интерактивна фотографија кроз jQuery
Овај демо се може искористити на сајтовима где има доста простора на екрану. Кликом на одређену секцију сајт открива бокс који приказује више информација о изабраној секцији.
Cloud Zoom
Плагин који као да је дизајниран са eCommerce сајтовима на уму. Cloud Zoom се лако имплементира и може доста побољшати корисников доживљај веб сајта.
Apple retina ефекат
Ко год да је користио iPhone, iPod touch или iPad зна шта значи “Retina View” који увеличава мали део екрана када додирнете тај део екрана на један дужи период. Овај демо имплементира тај ефекат.
0 Comments