Responsywny iframe oraz embed

autor: Robert

30 lipca 2014

Niejednokrotnie zamieszczamy na naszych stronach filmy np. z YouTube. Wklejenie kodu skopiowanego prosto ze strony powoduje, że film wyświetla się w ramce o sztywno określonej wielkości, co oczywiście jest efektem niepożądanym na responsywnych stronach www. Oczywiście można zastosować sztuczki w arkuszu stylów i wymusić na ramce responsywność, ale po co, skoro twórcy Bootstrapa zrobili to za Was:)

Podstawowy przykład

Tworzymy div z klasami .embed-responsive oraz .embed-responsive-16by9 gdy chcemy by film wyświetlał się w proporcjach 16:9 lub .embed-responsive-4by3 gdy chcemy by film wyświetlał się w proporcjach 4:3. Wewnątrz tego diva umieszczamy naszą ramkę z klasą .embed-responsive-item i już:)

---

Post się przydał? Oceń go proszę.

(6 głosów, średnia: 4,67 na 5)

Loading...

---

← Starszy post
Studnia / Well
Nowszy post →
Zakładki / Nav tabs