„SuperEmbed.js“ lengvai įdėkite atsakingus vaizdo įrašus

Šiuolaikinis internetas yra visiškai reaguoja ir daugiau dizainerių tai suvokia kiekvieną dieną. Tačiau yra sudėtingas iššūkis, kai kalbama apie atsakingą dizainą: įdėtas turinys.

Kiekviena „YouTube“ vaizdo įrašų svetainė „Vimeo“ turi a numatytasis įterpimo kodas pritvirtintas prie tam tikro dydžio. Tai reiškia, kad kūrėjai turi naudoti kitus sprendimus sukurti visiškai reaguojančius vaizdo įrašus.

Tačiau vietoj CSS konteinerių klasės galite naudoti SuperEmbed.js, nemokamą „JavaScript“ biblioteką kurti atsakingus vaizdo įrašus.

Šis papildinys sprendžia dvi problemas iškart. Visi integruoti vaizdo įrašai bus užpildykite pagrindinį konteinerį, taip pat pakankamai lanksti keisti dydį pagal naršyklės langą.

Geriausia yra tai, kad SuperEmbed.js nereikalauja papildomo kodo, taip galite tiesiog įterpti failus ir leiskite jiems paleisti. Ši JS biblioteka rūpinasi likusiais nukreipti įterptus elementus iš tam tikrų svetainių.

Visi vaizdo įrašai išlaikyti savo specifinius aspektus, taigi jums nereikės nerimauti dėl netikrų matmenų. Ir SuperEmbed veikia kaip a vanilės JS biblioteka su jokių priklausomybių pavyzdžiui, jQuery.

Dabar, SuperEmbed palaiko 15 + vaizdo įrašų iš tokių svetainių kaip „YouTube“, „Vimeo“, „Kickstarter“, „DailyMotion“, „Facebook“, „Vid.me“ ir „Archive.org“ (daugelis kitų). Šis sąrašas yra vis dar auga, todėl tikimasi, kad per tam tikrą laiką bus įtrauktos daugiau vaizdo transliavimo paslaugų.

Norint, kad šis įrankis veiktų, jums tereikia atsisiųskite biblioteką ir pridėkite ją prie svetainės antraštės kaip ir taip:

Galite atsisiųsti a visiškai kopijuoti iš „GitHub“ repo, kuriame taip pat yra specifikacijos palaikomos vaizdo įrašų svetainės ir dabartinė naršyklės pagalba.

Dažniausiai „SuperEmbed“ palaiko visas modernias naršykles „Firefox 3.5+“, „Chrome 4+“ ir „Internet Explorer 9“ ar naujesnės versijos.

Tai labai įspūdinga biblioteka, atsižvelgiant į visą naršyklės palaikymą ir kaip gerai veikia iš lauko. Tai gerokai paprastesnis sprendimas nei CSS, jei gerai, pasikliaudami „JavaScript“.

Tu gali rasti daugiau informacijos GitHub ir jūs galite jį pamatyti gyventi šiame smuikyje.