Change video resolutution or zoom in the website

11 replies · opened Oct 22, 2019

LLangeNelusOct 22, 2019

Dear,

I am working on the website (again) and I am wondering if it's possible to change the resolution of the video. If you visiti www.fiammoflame.com right now, the video is being displayed zoomed in. I want to show the whole video in the header. How can I arrange this? It's absolutely must for me.....

Thanks in advance.

LLangeNelusOct 23, 2019

Can you please help?

SSemicolon WebSTAFFOct 23, 2019

Hello,

Unfortunately, not. As we have mentioned earlier, the Video is resized by the Youtube BG Plugin based on the available area inside the DIV so that it fits without any black lines. You will have to consider using self hosted HTML5 Videos if you would like to control the resolution.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

LLangeNelusOct 24, 2019

If I host a MP4 bymyself, which is absolutley no problem, how can I fix that?

SSemicolon WebSTAFFOct 24, 2019

Hello,

If you are using a Full Screen Section and a Video inside it, the Video has to be resized to fit the Section, otherwise there will either be a Black Line on the Top/Bottom or the Left/Right. For Self-Hosted Video, you can consider using this code replacing the existing .video-wrap Section:


	
		
		
	
	

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

LLangeNelusOct 24, 2019

Works like a charm om desktop! How can I make this work on a mobile? Because it doesnt show anything right now on iphone

SSemicolon WebSTAFFOct 24, 2019

Hello,

Apple and Android do not allow autoplay for HTML5 Videos/Audio to prevent unsolicited usage of Bandwidth (which can be Cellular) on the User’s Mobile Device. They can only be played on their native Video Player.

Here is the Official Reference for Apple: https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html .

Meanwhile, currently the Inline Video Autoplay is supported only from iOS 10 onwards. You can use the following instructions to make it work on iOS 10 or above devices:

  1. Add the playsinline Attribute to the <video> Tag. Example:

    ...
  1. Then add the .no-placeholder Class to the .video-wrap Container that encloses the <video> Tag. Example:

    
        ...
    
    

This will definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

LLangeNelusOct 24, 2019

And one more question; It only works local.. I doesnt being showed on live situation. How come?

LLangeNelusOct 24, 2019

Nevermind, its my cache. Im going to look at the comment above, thanks!

SSemicolon WebSTAFFOct 24, 2019

Hello,

No worries. Do let us know if you are still facing any further issues with this.

LLangeNelusOct 25, 2019

So I made a few adjustments and I've found out that on several iphones the video is not displaying. How can I fix this? For example, on my phone (also a iPhone) the video is being displayed.

SSemicolon WebSTAFFOct 27, 2019

Hello,

As we mentioned this is an Experimental Feature from Apple and is only available iOS10 onwards. Additionally, there are no codes in Canvas that would block the Default Behavior of the Mobile Browser. So its the Mobile Browser that is causing the Video to not display properly.

We will definitely release updates if Apple/Android releases updates on this.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard