How to fix video issues on responsive?

Hi,

How do I go about making the videos on my site responsive? When I was using my previous theme all the videos were full width and responsive, now they’ve not. Any ideas on how I can fix this?

Thanks,

Adrian

3 Answers

DominicStaff
answered 11 years ago

please send me a screenshot for further checking.

Hope this helps !

Regards,
Dominic

Adrian Martinez
answered 11 years ago

Hi, Dominic

Here’s the screen shot: http://www.adrianlinks.com/wp-content/uploads/2013/08/video.png

As you see the video doesn’t change size to fit the screen dimensions. The video ends up just getting cut off.

Thanks again,

Adrian

Adrian Martinez
replied 11 years ago

It worked. Thanks!

DominicStaff
answered 11 years ago

To resolve this problem, you can log in to Dashboard > Theme > Customize > add the following code in the “Header Script”


<script>
jQuery(document).ready(function($){
function responsiveIframe() {
     // Fix responsive iframe
    $('iframe').each(function(){
      var iw = $(this).width();
      var ih = $(this).height();
      var ip = $(this).parent().width();
      var ipw = ip/iw;
      var ipwh = Math.round(ih*ipw);
      $(this).css({
        'width': ip,
        'height' : ipwh,
      });
    });
  }

  responsiveIframe();

  $(window).resize(function(){
    responsiveIframe();
  });
});
</script>

Hope this helps !
Regards,
Dominic