mb.YTPlayer for background videos
[resolved] Horizontal fitting (4 posts)

  1. Alan Massimiliano Schiaretti
    Posted 3 years ago #

    Thanks for the great plugin, Pupunzi! Is there a way to force the video background to fit horizontally? By default this plugin force the video to fit the window vertically in order to avoid black strips on top and bottom (I suppose), but I need to change this behaviour for my band website. Do I have to edit the plugin code? Thanks in advance for your help!


  2. pupunzi
    Plugin Author

    Posted 3 years ago #


    You should edit the jquery.mb.YTPlayer.js and replace the jQuery.fn.optimizeDisplay with:

    	var player=this.get(0);
    	var data = jQuery("#"+player.id+"_data").data();
    	var wrapper = jQuery("#wrapper_"+player.id);
    	var lightCrop = true; //data.lightCrop;
    	var win={};
    	var el= data.ID?jQuery("#"+data.ID):jQuery(window);
    	win.width= el.width();
    	win.height= el.height();
    	var vid={};
    	vid.width = win.width + ( lightCrop ? (win.width*20/100): 0 );
    	vid.height = data.ratio == "16/9" ? Math.ceil((9*win.width)/16): Math.ceil((3*win.width)/4);
    	var marginTop= -((vid.height-win.height)/2);
    	var marginLeft= -( lightCrop ? (win.width*10/100): 0 );
    	wrapper.css({width:vid.width, height:vid.height, marginTop:marginTop, marginLeft:marginLeft});

    This will remove the optimization for the screen size.


  3. lasha200
    Posted 3 years ago #

    how to make a background to all window, on my site background video have some spaces and in my plugin setting page is not Section "home video ratio".

  4. pupunzi
    Plugin Author

    Posted 3 years ago #

    In the latest 1.0 version the aspect ratio option has been removed as the component retrieve the ratio from a direct call to the YT FEED API. In the response of that call there's a parameter that specify if the video is widescreen or not and the component use this to set either the 16/9 or the 4/3 aspect ratio.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic