ХТМЛ5 - Прелази

Преглед садржаја
Прелази припадају новој серији ефеката који су уграђени ХТМЛ5 а то се може подесити помоћу ЦСС3Раније је ову врсту ефеката морао да изводи Јавасцрипт користећи једну од многих доступних библиотека и оквира (Моотоолс, Јкуери итд.), Али када је уведен нови стандард, такви ефекти су уграђени, као што су прелази, анимације, трансформације …
Коришћење прелаза
Пре него што видимо како да користимо прелаз, морамо знати шта је то. Знамо то када применимо промену на својство : лебдети када задржите показивач миша изнад елемента, он одмах преузима стил додељен када је миш изнад њега, прелаз није ништа друго до контрола над начином на који ће се та промена извршити, односно трајањем промене, брзином при који ће се спровести како би се постигао ефекат попут мешавине између старог и новог стања.
Тада можемо резимирати да је прелаз прелазак из једног стања у друго унутар ХТМЛ документа и свих својстава помоћу којих се ова промена може извршити, на следећој слици видимо почетно стање и коначно стање, прелаз је оно што се дешава Између обоје.
ЕНЛАРГЕ
Својства прелаза
Погледајмо својства и атрибуте које можемо користити за прелазак:
  • транзиција-кашњење: Одређује кашњење у јединици времена након којег ће апликација за ефекте почети.
  • прелазно трајање: Одређује временски период током којег ће се извршити прелазак.
  • прелазна својина: Одређује на које својство ће се применити прелаз.
  • функција преласка-времена: Одређује начин на који ће се средње вредности третирати током извршавања транзиције.
  • прелаз: То је пречица помоћу које можемо применити сва својства прелаза у једној ЦСС декларацији. Може се сажети на следећи начин: прелаз:
Морамо то нагласити транзиција-кашњење И прелаз-трајање користити јединице времена као вредности, па се мора навести са с секунди или Госпођа мили секунди.
Погледајмо пример како извршити прелаз за елемент у ХТМЛ5, да видимо следећи код:
 Пример

Постоји много различитих врста воћа - само преко 500 врста банана постоји. Док додамо безброј врста јабука, поморанџи и другог добро познатог воћа, суочени смо са хиљадама избора.


Као што видимо, имплементирали смо различита својства прелазног елемента помоћу префикса -вебкит, ово нас уверава да ће бити испуњено за прегледаче Хром И Сафари, да их спроведе за Фирефок И Опера морамо укључити и префиксе -моз и -о.
Такође можемо приметити да смо поставили одлагање у 100 мс што значи да ће имати мало кашњења пре почетка транзиције, онда би целокупно трајање ефекта требало да траје 500 мс што је оно што је утврђено у трајање.
Погледајмо слику са свим фазама ефекта:
ЕНЛАРГЕ
Као што видимо, транзиција чини да се ефекат примењује постепено током наведеног времена.
Овим завршавамо водич о томе како применити ефекат прелаза на елемент у ХТМЛ5, морамо наставити вјежбати све док не постане природно поставити тражени код тако да наши документи и странице постигну већу динамику.Да ли вам се допао и помогао овај водич?Можете наградити аутора притиском на ово дугме да бисте му дали позитиван поен

Ви ће помоћи развој сајта, дељење страницу са пријатељима

wave wave wave wave wave