ЦСС Транситионс: опис, својства и функције употребе

21. 3. 2020.

Стварање доброг сајта данас је једноставно: довољно је стручњака, процеси побољшања функционалности и његове презентације (структура и садржај) активно иду. Ово последње је дизајн средстава ЦСС-а - као најједноставније, економично и ефикасно решење.

цсс транситионс

Борба између девелопера за клијента и власника сајта за интересовање посетилаца и присуство ресурса преселила се у сферу танког оглашавања и меког (топлог и динамичног) садржаја.

ЦСС Јумп Плаце

в псевдокласе :hover и обратно. Према тренутном мишљењу, место ЦСС Транситионс у псеудо-класи: ховер и бацк. Постоји стил тагова, на пример ТагСтиле, и постоји ТагСтиле: ховер стил. Задатак псеудо-класе је да садржај свих правила другог описа стави у први, чим миш пређе ознаку, и чим она оде, све се врати назад.

У таквој шеми (у класичној верзији), боје позадине, боје текста, оквир, његове кривуље, увлаке и други видљиви елементи се обично мењају. позволяет это сделать плавно и управлять плавностью. Коришћење правила за ЦСС прелазе омогућава вам да то урадите глатко и контролишете глаткоћу.

Правило може да промени многе друге елементе, али се оне обично користе. CSS, можно найти на официальных ресурсах в интернете. Комплетан списак правила на које утиче ЦСС својство се може наћи на званичним ресурсима на Интернету.

Садржај транзиционог правила

s включает в себя (transition='*'): Задатак правила: извршити глатки прелазак других правила из једног стања у друго, стога ЦСС Транситион с укључује (транситион = '*'):

  • назив имовине на коју се то односи (* - својина);
  • трајање процеса (* - трајање);
  • прелазна функција (* -тиминг-функција);
  • кашњење покреће процес (* -одад).

Дозвољено је да напише кратко правило о ЦСС-у канона:

  • 1 s ease .5 s ; транзиција: све 1 с лакоћом .5 с ;

Транзиција се односи на сва правила, која се обављају у једној секунди у стилу 'лакоће' са пола секунде одгоде. Свеједно, написано елементима правила:

  • * -проперти: алл;
  • * - трајање: 1с;
  • * -тиминг функција: лакоћа;
  • * -делаи: .5с;

поддерживается основными браузерами, но никогда не помешает убедиться в этом и в наличии кроссбраузерности записанных правил. Правило о транзицији подржавају главни прегледници, али никада не боли да се у то уверите и компатибилност писаних правила.

Цлассиц апплицатион

: background: Најједноставније и најчешће се користи прелазак боје позадине (симбола): ЦСС Транситион : бацкгроунд:

цсс прелазна трансформација

У овом примеру, само правило прелаза ће бити примењено на правило позадинске боје (трајање 2 секунде, функција олакшавања, кашњење 0,2 секунде), а друга правила ће се одмах пребацити у друго стање.

Функција преласка (стил)

- функция перехода, то есть кривая времени, как выполнять переход из одного состояния в другое. Важан део правила ЦСС Транситионс је транзициона функција, односно крива времена, како направити прелаз из једног стања у друго. Глатка опција (лако) је подразумевана: прелаз почиње полако, убрзава се и успорава на крају.

цсс прелазна позадина

Вредност 'линеарног' одређује униформни прелаз: 'лака ин' - полако започиње транзицију, затим постепено убрзава до краја, и 'олакшава' - делује обрнуто.

Кубична-безиер функција (к1, и1, к2, и2) вам омогућава да креирате сопствену опцију транзиције, али коришћење званичних ресурса и локација са добрим искуством коришћењем Безиер-ове криве је још пожељније. Нешто ново што ће се десити сигурно неће успети, али искуство задовољства оку и психологије посетиоца опција је ипак нагомилано.

Конверзија се комбинује са конверзијом

& Transform. Комбинација правила ЦСС Транситион & Трансформ даје добар ефекат. Први одређује време процеса, друго показује шта треба да ради све ово време.

Трансформације вам омогућавају да преместите ознаке, ротирате их, промените величину, промените положај. Размотрите комбинацију:

  • ( 180 deg ); трансформација: ротирање ( 180 степени );
    • 2 s ease-out .2 s ; транзиција: све 2 секунде .2 с ;

За две секунде, садржај ознаке ће се претворити за 180 степени. Експериментишући са функцијама транслате, сцале, ротате, скев и њиховим варијацијама, можете постићи занимљиве ефекте и дати вашем послу јединствену оригиналност.

транситион цсс проперти

позволяет вращать тексты и фигуры, как это необходимо для достижения поставленной цели. ЦСС3 вам такође омогућава да трансформишете 3д, то јест, да померите ознаку у киз координатама, што, у комбинацији са ЦСС Транситионс, омогућава да ротирате текстове и облике по потреби како бисте постигли циљ.

Компатибилан са транзиционим правилом

для background, border, color и других очевидно визуальных правил нормально, естественно и удобно, то для некоторых случаев, например, попытки совместить CSS Transition & Display, можно просто потратить время и не достичь желаемого. Ако је коришћење ЦСС Транситионс за позадину, границу, боју и друга очигледно визуелна правила нормално, природно и практично, онда у неким случајевима, на пример, покушавајући да комбинујете ЦСС Транситион & Дисплаи, можете једноставно потрошити време и не постићи оно што желите.

цсс дисплаи дисплаи

Уопштено говорећи, када се планира употреба визуелних ефеката, препоручује се да се разликује "видљиво од изгледа". Направити прелепу ротацију облика или текста за одређено време је акција која има мало везе са својством приказа, видљивости, з-индекса. , то первое не упоминается, хотя его использование привносит в тег что-то заметное, но слабо управляемое. Међутим, ако су последња два јасно назначена на листи правила на која се односи ЦСС транзиција , прва се не помиње, иако њено коришћење уводи нешто уочљиво, али лоше контролисано, на ознаку.

Правило транзиције није само: ховер и обрнуто, може се успешно применити и на друге псеудо-класе, на пример: фоцус или: ацтиве.

Уопштено, Транситион и Трансформ су ЦСС карактеристике које, логично, нису директно повезане са њим (све су то стилови, а не алгоритми). Али током протеклих неколико година, акценти су се толико променили да не користи богати арсенал ЦСС-а и ЦСС3-а је једноставно неприступачан луксуз.

О абнормалном и природном

На почетку личних рачунара, када је израђен математички процесор за математичке прорачуне, било је ненормално имати 386. рачунар без математичког копроцесора када је дошло до ефективне употребе Фортран програма за израчунавање путање до Месеца. Наравно, данас се не дешава да било ко купује рачунар пита да ли има хардверски имплементирана средства за математичке прорачуне.

цсс транситионс

Без икакве сумње, алгоритам за израчунавање времена прелаза из једног стила у други или ротације ознаке око друге ознаке има веома мали однос према идејама о стиловима. Ознака није електрон да ротира близу атома.

И ЦСС - по дефиницији, табела каскадних стилова, и са моментима наслеђивања, узимајући у обзир мобилне уређаје, са приоритетима, комбинацијама.

Али свет се тако брзо мења. Данас не можете другачију формулу назвати математиком, јер концепт броја у модерном програмском језику није много другачији од концепта низа.

Али, ако свима одговара, ако је то згодно и ефикасно, онда можда има смисла да промените сопствене идеје. & Transform сделают такую маленькую революцию: не нужно программировать то, что уже давно не нуждается в этом. Очигледно је да ће ЦСС Транситион & Трансформ направити тако малу револуцију: нема потребе да програмирате нешто што јој више није потребно. Програмери дуго времена пате од болести професије, која се разликује овако: преписати не само оно што су други радили прије њих за сљедећи задатак, већ и оно што су и сами урадили јуче. Шта учинити, свијет и технологије су промјењиве, а чак и мале метаморфозе у подручју примјене понекад доводе до потребе за значајним промјенама кодова.

Ипак, таква трансформација математичких алгоритама у лепе и практичне ЦСС правила је веома практична и ефикасна.