nl.hideout-lastation.com
Paradijs Voor Ontwerpers En Ontwikkelaars


Integreer responsieve video's eenvoudig met SuperEmbed.js

Het moderne web is volledig responsive en meer ontwerpers realiseren dit elke dag. Maar er is een vervelende uitdaging als het gaat om responsief ontwerp: embedded content .

Elke videosite van YouTube tot Vimeo heeft een standaard insluitcode die is vastgesteld op een bepaald formaat. Dit betekent dat ontwikkelaars andere oplossingen moeten gebruiken om volledig responsieve video's te maken .

In plaats van een CSS-containerklasse te gebruiken, kunt u echter SuperEmbed.js gebruiken, een gratis JavaScript-bibliotheek voor het maken van responsieve video's .

Deze plug-in lost twee problemen tegelijk op. Alle ingesloten video's worden uitgerekt om de hoofdcontainer te vullen, terwijl ze ook flexibel genoeg zijn om van grootte te veranderen op basis van het browservenster .

Het beste is dat SuperEmbed.js geen extra code vereist, dus je kunt de bestanden gewoon insluiten en ze laten uitvoeren . Deze JS-bibliotheek zorgt voor de rest door ingesloten elementen van bepaalde sites te targeten .

Alle video's behouden hun specifieke beeldverhoudingen, zodat u zich geen zorgen hoeft te maken over logge dimensies. En SuperEmbed werkt als een vanille-JS-bibliotheek zonder afhankelijkheden zoals jQuery.

Op dit moment ondersteunt SuperEmbed 15+ video-insluitingen van sites zoals YouTube, Vimeo, Kickstarter, DailyMotion, Facebook, Vid.me en Archive.org (naast vele andere). Deze lijst groeit nog steeds, dus verwacht dat er in de loop van de tijd meer video-streamingdiensten zullen worden toegevoegd.

Om deze tool werkend te krijgen, hoeft u alleen de bibliotheek te downloaden en toe te voegen aan de header van uw site, zoals:

Je kunt een volledig exemplaar downloaden van de GitHub-repo, die ook specificaties voor ondersteunde videosites en actuele browserondersteuning bevat .

Voor het grootste deel ondersteunt SuperEmbed alle moderne browsers van FireFox 3.5+, Chrome 4+ en versies van Internet Explorer 9 of hoger.

Dit is een zeer indrukwekkende bibliotheek die alle browserondersteuning in overweging neemt en goed werkt, direct uit de doos . Het is een veel eenvoudigere oplossing dan de CSS-hacks als je het goed vindt om op JavaScript te vertrouwen.

Je kunt meer informatie vinden op GitHub en je kunt het live in deze viool zien.

25 creatieve boekenplankontwerpen die je moet zien

25 creatieve boekenplankontwerpen die je moet zien

Als je van boeken houdt, zal geen enkele tablet, e-book of e-reader je liefde voor papier en print laten varen. Evenzo zal een boekenwurm altijd een bibliotheek met boeken beheren. Als u echter geen ruimte kunt vinden voor een persoonlijke bibliotheek, thuis of op het werk, kunnen deze creatieve boekenplanken u misschien helpen uw favoriete leesmateriaal beter te organiseren

(Technische en ontwerptips)

30 opvallende bliksemfoto's

30 opvallende bliksemfoto's

Weet je hoe ze zeggen dat bliksem nooit twee keer op dezelfde plaats valt? Wel, "zij" logen. Bliksem kan vaak dezelfde plek of gebied raken - in feite is er een plaats in Venezuela, genaamd de Vuurtoren van Catatumbo, waar bliksem 1, 2 miljoen keer per jaar toeslaat - want hoe kun je anders zulke verbazingwekkende foto's van bliksemschichten vinden

(Technische en ontwerptips)