Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen der Seite angezeigt.

--- region [2018/09/25 22:17] – [Highlights in unmittelbarer Nähe] admin
+++ region [2018/09/25 22:22] – admin
@@ Zeile 7: / Zeile 7: @@
 <iframe width="560" height="315" src="https://www.youtube.com/embed/gOOgKDVCM30?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
+<script>
+// Find all YouTube videos
+var $allVideos = $("iframe[src^='//www.youtube.com']"),
+    // The element that is fluid width
+    $fluidEl = $("body");
+// Figure out and save aspect ratio for each video
+$allVideos.each(function() {
+  $(this)
+    .data('aspectRatio', this.height / this.width)
+    // and remove the hard coded width/height
+    .removeAttr('height')
+    .removeAttr('width');
+});
+// When the window is resized
+$(window).resize(function() {
+  var newWidth = $fluidEl.width();
+  // Resize all videos according to their own aspect ratio
+  $allVideos.each(function() {
+    var $el = $(this);
+    $el
+      .width(newWidth)
+      .height(newWidth * $el.data('aspectRatio'));
+  });
+// Kick off one resize to fix all videos on page load
+}).resize();
+</script>
 </html>