Game Files: valid

Showing posts with label valid. Show all posts

Saturday, December 10, 2016

Cara Memasang Video Responsive dan Valid HTML5

Cara Memasang Video Responsive dan Valid HTML5 - Sekarang ini model responsive sedang popular di kalangan blogger ( khususnya blog yang memberikan informasi atau tutor tentang design blog ) , kali ini saya akan memberikan trik bagaimana membuat dan memasang video ( entah itu video youtube maupun video lainya , oh ya saya bukan hanya sekedar memberikan trik responsive pada video , melainkan saya juga akan memberikan trik dan tips cara membuat video youtube maupun video lainya menjadi valid , karena pada umumnya video default yang kita pasang belom valid

Berikut Cara Memasang Video Responsive dan Valid HTML5 :

1. Pertama sobat pasang dulu widget CSS di bawah ini . diatas kode ]]></b:skin> atau </style>

.Video-Responsive {
 position:relative;padding-bottom: 56.25%;
 padding-top:25px;
 height:0;
}
.Video-Responsive iframe, video, object, embed {
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
}

2. Setelah anda Memasang CSS nya , sekarang saatnya anda pasang HTML nya untuk memanggil css tadi. Berikut Contoh penerapan kontrol koding pada iframe pada embed video YOUTUBE

<div class="Video-Responsive">
<object data="//www.youtube.com/embed/5nxxWzPSXso" height="329" width="592"></object></div>

Yang Perlu anda Perhatikan dalam kode diatas . anda hanya perlu mengganti url video //www.youtube.com/embed/5nxxWzPSXso dengan url video anda . Bagi anda yang belum tahu cara mendapatkan embed video silahkan googling dulu ( Caranya mudah kok ) kapan-kapan kalau ada waktu lagi saya buatkan tutorialnya

Berikut merupakan demo hasil Video Responsive dan Valid HTML5 di atas :

Available link for download