ßê ðîçòÿãíóòè ôëåø

Ôëåø (Flash) ÿâëÿº ñîáîþ ïëàòôîðìó äëÿ ñòâîðåííÿ ð³çíèõ âåá-äîäàòê³â, òàêèõ ÿê àí³ìàö³ÿ, ðåêëàìí³ áàíåðè, ³ãðè, â³äåî-òà àóä³îçàïèñè. ²ñíóº ê³ëüêà ñïîñîá³â ðîçòÿãíóòè çîáðàæåííÿ íà âñþ ñòîð³íêó ñàéòó.
ßê ðîçòÿãíóòè ôëåø
²íñòðóêö³ÿ


1
Âèêîðèñòîâóéòå òàêèé çàñ³á îôîðìëåííÿ ïîñâ³äêè âåá-ñòîð³íîê, ÿê https://makecode.ru/theme/css-30/CSS 3.0. Çàâäÿêè âëàñòèâîñò³ background-size, âîíî çðîáèòü çîáðàæåííÿ â çàäàíîìó ìàñøòàá³. Ââåä³òü çíà÷åííÿ â îäèíèöÿõ (em, cm, px òîùî) òà ó â³äñîòêàõ (öå âñòàíîâëþº ðîçì³ð çîáðàæåííÿ â³ä øèðèíè àáî âèñîòè åëåìåíòà). ßêùî âè âêàæåòå îäíå çíà÷åííÿ, òî äðóãå îòðèìຠñòàòóñ auto. Ïðè óñòàíîâö³ cover àáî contain êàðòèíêà ïðîïîðö³éíî çàïîâíèòü ïðîñò³ð ñàéòó áåç ïðîá³ë³â, ³ ¿¿ öåíòð ñï³âïàäå ç öåíòðîì ñòîð³íêè. Òàêèé ñïîñ³á ïðàöþº â áðàóçåðàõ: Opera, Safari, Chrome Whatever. ßêùî âàì íåîáõ³äíî â³äîáðàçèòè ôëåø â Mozilla Firefox, â òåãó «object» âêàæ³òü äëÿ íüîãî òèï çîáðàæåííÿ «block».  ³íøîìó âèïàäêó â áðàóçåð³ íà çîáðàæåíí³ áóäå ïðèñóòí³é ñìóãà ïðîêðóòêè ïî âåðòèêàë³.
2
Ùîá òðîõè çì³íèòè ðîçì³ðè flash, ââåä³òü íà ñòîð³íö³ áðàóçåðà * {margin: 0-padding: 0}. Ó êîíêðåòíîìó áðàóçåð³ öåé êîä ñïðàöþº ïî-ñâîºìó (ó êîæíîãî ïî çàìîâ÷óâàííþ º â³äñòóïè). Ïàì'ÿòàéòå, ùî âè ìîæåòå âèâåñòè flash ³ íå îáìåæóâàòè ìàñøòàá 100%. Ó öüîìó âèïàäêó âêàæ³òü òåã body {display: inline-}. ³í âèäàëèòü ðàìêó íàâêîëî çîáðàæåííÿ.
3
ßêùî âàì ïîòð³áíî çá³ëüøèòè ðîçì³ð ðóõîìîãî çîáðàæåííÿ (êë³ïó, ðîëèêà), ñïðîáóéòå ñòâîðèòè «ãóìîâèé» ôëåø, ÿêèé áóäå çì³íþâàòèñÿ äëÿ çàïîâíåííÿ â³êíà â áðàóçåð³ ïîâí³ñòþ. Ó ïåðøó ÷åðãó íåîáõ³äíî ñòâîðèòè ìåòîä onResize, ÿêèé ï³äãîòóº çîáðàæåííÿ äî ðåàãóâàííÿ íà çì³íè ãàáàðèò³â â³êíà. ϳñëÿ çâ'ÿæ³òü îá'ºêò ç êëàñîì Stage, ùîá â³í ïî÷àâ îòðèìóâàòè â³äîìîñò³ ïðî çì³íè ðîçì³ð³â â³êíà áðàóçåðà. Stage âîëî䳺 äåÿêèìè ñòàòè÷íèìè âëàñòèâîñòÿìè.  äàíîìó âèïàäêó âàì çíàäîáèòüñÿ ðåæèì Stage.scaleMode = «noScale», ÿêèé íå áóäå ìàñøòàáóâàòè ðîëèê ïîâí³ñòþ çã³äíî ãàáàðèòàì â³êíà, à íå ðîçòÿãóâàòè îêðåì³ åëåìåíòè ó ôëåø.

Óâàãà, ò³ëüêè ÑÜÎÃÎÄͲ!