A SuperEmbed.js segítségével könnyen beágyazhatja az érzékeny videókat

A modern web teljesen érzékeny és a tervezők egyre többet vesznek észre mindennap. De van egy bosszantó kihívás az érzékeny tervezésnél: beágyazott tartalom.

Minden videó a YouTube-tól a Vimeo-hoz van egy alapértelmezett beágyazási kód meghatározott méretre rögzítve. Ez azt jelenti, hogy a fejlesztőknek más megoldásokat kell használniuk készítsen teljesen érzékeny videókat.

A CSS konténerosztály használata helyett azonban használhatja SuperEmbed.js, ingyenes JavaScript-könyvtár érzékeny videók létrehozása.

Ez a bővítmény két problémát megold egyszerre. Minden beágyazott videó lesz feszítse ki a fő tartályt, ugyanakkor elég rugalmas ahhoz, hogy átméretezése a böngészőablak alapján.

A legjobb rész a SuperEmbed.js nem igényel extra kódot, így lehet beágyazza a fájlokat és hadd fussanak. Ez a JS könyvtár gondoskodik a többitől beágyazott elemeket céloz meg bizonyos webhelyekről.

Minden videó megőrizzék sajátos képarányukat, így nem kell aggódnia a nyomasztó méretek miatt. És a SuperEmbed a vanília JS könyvtár val vel nincs függőség például a jQuery.

Most, SuperEmbed támogatja a 15+ videó beágyazást olyan webhelyekről, mint a YouTube, a Vimeo, a Kickstarter, a DailyMotion, a Facebook, a Vid.me és az Archive.org. Ez a lista még növekszik, így több videó streaming szolgáltatást várnak hozzá az idő múlásával.

Ahhoz, hogy ez az eszköz működjön, csak meg kell töltse le a könyvtárat és add hozzá a webhely fejlécéhez így tetszik:

Letöltheti a teljesen másolja a GitHub repóból, amely tartalmazza a specifikációkat is támogatott videó webhelyek és aktuális böngésző támogatás.

A legtöbb esetben a SuperEmbed támogatja az összes modern böngészőt a Firefox 3.5+, a Chrome 4+ és az Internet Explorer 9 vagy újabb verziói.

Ez egy nagyon lenyűgöző könyvtár, figyelembe véve a böngésző támogatását és milyen jól működik működik a dobozból. Ez sokkal egyszerűbb megoldás, mint a CSS-hack, ha rendben van a JavaScript használatával.

Találhatod több információ a GitHub-on és láthatod élő futás ebben az ötletben.