JQuery per rendere i video Responsive

Sommario

Web design reattivo o adattabile per diversi dispositivi, serve affinché i nostri design si adattino perfettamente allo schermo di qualsiasi dispositivo con una connessione Internet.
L'uso delle query multimediali in CSS3 consente di creare design reattivi con le query multimediali CSS3.
Una media query è costituita da un tipo di media e almeno una query che limita i fogli di stile utilizzando le caratteristiche dei media come larghezza, altezza e colore. Aggiunto in CSS3, le query multimediali consentono alla visualizzazione del contenuto di adattarsi a una gamma specifica di dispositivi di output senza dover modificare il contenuto stesso.
Le query multimediali sono costituite da un tipo di supporto e da una o più espressioni, che coinvolgono le caratteristiche del supporto, che vengono risolte come vere o false. Il risultato della query è vero se il tipo di media specificato nella media query corrisponde al tipo di dispositivo visualizzato e tutte le espressioni nella media query sono vere. Quando una media query è vera, vengono applicati il ​​foglio di stile o le regole di stile corrispondenti, seguendo le normali regole a cascata.
 

Questa tecnica responsive può essere utilizzata con tutti i nostri file su un sito web anche se i contenuti multimediali, per rendere il nostro sito più pratico e accessibile a tutti i dispositivi, quindi possiamo rendere i nostri video anche Responsive, cioè autoregolanti o adattabili a seconda il dispositivo di Exit.
Per questo abbiamo FitVids.js, questo è un plugin utilizzato per rendere reattivo qualsiasi video, si adatterà perfettamente e automaticamente alle dimensioni del contenitore o del dispositivo di output, qualcosa di molto pratico per il web design in termini di contenuto da visualizzare perfettamente su telefoni smartphone e tablet.
Devi includere jQuery 1.7 o successivo e FitVids.js nel design della tua pagina web e indirizzare il contenitore video con fitVids ().

L'uso è semplice, basta chiamare la funzione fitVids puntando un video e l'elemento viene automaticamente avvolto con ae CSS da ridimensionare deve essere applicato.
Attualmente è compatibile con i principali servizi come Youtube, Vimeo, Blip.TV o Viddler
Possiamo aggiungerlo a wordpress con una funzione, in modo che qualsiasi classe div .video venga ridimensionata automaticamente.
 }}}} add_action ('init', 'fitvids'); ?> var13 -> 
Ti è piaciuto e hai aiutato questo Tutorial?Puoi premiare l'autore premendo questo pulsante per dargli un punto positivo

Aiuterete lo sviluppo del sito, condividere la pagina con i tuoi amici

wave wave wave wave wave