Since the URL sets the autoplay parameter to 1, the video would play automatically once the player has loaded.Įmbed a player using the IFrame Player APIįollow the IFrame Player API instructions to insert a video player in your web page or application after the Player API's JavaScript code has loaded.
The tag below would load a 640x360px player that would play the YouTube video M7lc1UVf-VE. The URL has the following format: VIDEO_ID If you create the element yourself (rather than using the IFrame Player API to create it), you can append player parameters directly to the end of the URL. The tag's height and width parameters specify the dimensions of the player. Embed a player using an tagĭefine an tag in your application in which the src URL specifies the content that the player will load as well as any other player parameters you want to set.
IFRAME WIDTH HOW TO
The following section explains how to configure your player to load a playlist or a user's uploaded videos. Note that the instructions below demonstrate how to embed a player that loads a single video. You can use any of the following methods to embed a YouTube player in your application and specify player parameters. We recommend 16:9 players be at least 480 pixels wide and 270 pixels tall. If the player displays controls, it must be large enough to fully display the controls without shrinking the viewport below the minimum size. Note: Embedded players must have a viewport that is at least 200px by 200px. Each parameter definition identifies the players that support the corresponding parameter.
This page currently defines all parameters supported in any YouTube embedded player. You can also use the enablejsapi parameter to enable the player to be controlled via the IFrame Player API. For example, you can automatically play videos using the autoplay parameter or cause a video to play repeatedly using the loop parameter. This document explains how to embed a YouTube player in your application and also defines the parameters that are available in the YouTube embedded player.īy appending parameters to the IFrame URL, you can customize the playback experience in your application. In the CSS for the, set the position to absolute, it will take a fixed position relative to the parent.The value of the padding determines the aspect ratio. In the CSS for the, add a percentage value for padding-bottom and set the position to relative, this will maintain the aspect ratio of the container.In the HTML, put the player in a container.The below example is for a 16:9 ratio, however, this can be changed to work for other aspect ratios. This is a simple and common CSS trick to preserve the aspect ratio. We recommend the following technique to keep the player responsive and to preserve the aspect ratio of the video. As websites are responsive and fluid, we want to ensure the player is flexible working with dynamic pages. These small issues may be caused by the web page not being configured to maintain the correct scale and size of the player. There may be instances when you are viewing a video on a mobile site or a responsive web page and the video appears with black bars on the side or won't fit the layout. The width & height of the playere determines the aspect ratio. This is a widely used technique and can be used with other aspect ratios. Note: This article focuses on how to ensure the player iframe keeps the 16:9 aspect ratio.
0 kommentar(er)
