WebSite X5Help Center

 
Bjorn Andreassen
Bjorn Andreassen
User

Background video  en

Автор: Bjorn Andreassen
Просмотрено 1722, Подписчики 1, Размещенный 0  

How can I have a background video that starts automatically on desktop and mobile?

I have tried Row Format and background video but it does not appear on mobile.

Размещено
21 Ответы - 1 Корректно
Bjorn Andreassen
Bjorn Andreassen
User
Автор

Thanks, but as far as I can see, there was no solution for me.

Читать больше
Размещено От Bjorn Andreassen
Axel  
Axel  
User
Лучший пользователь месяца FR

In background, normally video is starting alone !

We speak about settings here

Читать больше
Размещено От Axel  
Bjorn Andreassen
Bjorn Andreassen
User
Автор

Yes and the video does not start. Video Size: 4.4 MB.
When I tested with a smaller video (2.8 MB) then the video started. Hmm.

Читать больше
Размещено От Bjorn Andreassen
Bjorn Andreassen
Bjorn Andreassen
User
Автор

...on mobile.

Читать больше
Размещено От Bjorn Andreassen
Bjorn Andreassen
Bjorn Andreassen
User
Автор

I discovered something strange!


When a video contains audio, it does not start on the mobile phone. When I removed the audio from video, video started.

Читать больше
Размещено От Bjorn Andreassen
Bjorn Andreassen
Bjorn Andreassen
User
Автор

A new problem was discovered.

Video is not centered. Is there a solution to center the background video?

Читать больше
Размещено От Bjorn Andreassen
Axel  
Axel  
User
Лучший пользователь месяца FR

you can check result here with video on the top (wait a little bit ...loading): https://lucasfalck.fr

Читать больше
Размещено От Axel  
Bjorn Andreassen
Bjorn Andreassen
User
Автор

Sorry, but I can't figure it out.
Can you paste the correct code that I need to use - in this thread?

Читать больше
Размещено От Bjorn Andreassen
Axel  
Axel  
User
Лучший пользователь месяца FR

Hey Bjorn,

Again you have not read the previous post. foot-in-mouth

Nothing is magic. A little bit investigation is mandatory. and coding knowledge is a little bit necessary too.
Sorry, but it's a workaound and not a normal usage of Website.

the KolAsim'user code is here

But you need also to find the name of your good cell with an 'inspect' into Chrome. Here into this code the cell name is imPageRow_1.

My code into my example is:

#imCell_46 *{font-size:4vw !important;line-height: 120% !important;} /* Pour le texte en Overlay */
#imPageRow_1 *{position:relative !important;} /* pour la cellule ou sera affiché texte et vidéo */
#imPageRowGraphicsVideo_1 { width:100% !important;} /* Pour redimmensionner correctement la vidéo */

</style>

<script>

function h_rowK(){
var ww =16; // Proportion en largeur;
var hh =9; // Proportion en Hauteur;
var wrowk = document.getElementById('imPageRow_1').offsetWidth;
var hiframe=Math.round(wrowk*hh/ww);
document.getElementById('imPageRow_1').style.height=hiframe + "px";}
window.onload = function () {h_rowK()}
window.onresize = function () {h_rowK()}

</script>

You can do an 'inspect' on my link in example to get these infos into the source of the page

https://wsx5.afsoftware.fr

Читать больше
Размещено От Axel  
Bjorn Andreassen
Bjorn Andreassen
User
Автор

Thanks. It worked but not as I wanted. I just want the video to be centered and not responsive so that it adjusts to the width.

Читать больше
Размещено От Bjorn Andreassen
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... LINK...?...

Читать больше
Размещено От  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Bjorn Andreassen
 ‪ KolAsim ‪ ‪ ... LINK...?... DEMO: http://mediabok.no/demo-crossfit/

(It > En) ... at the top you put an empty object 550 pixels high that you have to delete...
... now, in this my code this object I deleted it in with the code ...
... to get the resize ratio of the video, and the adaptation of the page, you must use this code of mine:

<!-- controllo esclusivo by KolAsim - INIZIO -->
<style>#imHTMLObject_26 {display: none }
#imPageRowGraphicsVideo_1 { width:100% !important;}</style>
<script> function h_rowK(){
var ww =16; // proporzione larghezza;
var hh =9; // proporzione altezza;
var wrowk = document.getElementById('imPageRow_1').offsetWidth;
var hiframe=Math.round(wrowk*hh/ww);
document.getElementById('imPageRow_1').style.height=hiframe + "px";}
window.onload = function () {h_rowK()}
window.onresize = function () {h_rowK()}</script>
<!-- controllo esclusivo by KolAsim - fine -->

... ... ... 

>> Step 3 - Map > The Page Properties window > The Expert  section | Custom Code: > ▼Before opening the HTML tag

.

Hello, ciao

.

Читать больше
Размещено От  ‪ KolAsim ‪ ‪
Bjorn Andreassen
Bjorn Andreassen
User
Автор

The empty object is a html code object I use to set an background video.

Step 4 - Pages > Row Format > Backgroudn video - Extendet to the width of the browser window.

If I delete this object the video is gone.

I have a custome code that is almost working, but it's have i gap on left side on desktop:
video {
margin-left: 50vw;
transform: translate(-50%);
}

I have updated so you can see what I mean.

Читать больше
Размещено От Bjorn Andreassen
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Bjorn Andreassen
The empty object is a html code object I use to set an background video. ... ... ... ... 

(It > En) .. is not the object of the video, it is that of my code imHTMLObject_26

... in your LINK I don't see my code applied ...

.

Читать больше
Размещено От  ‪ KolAsim ‪ ‪
Bjorn Andreassen
Bjorn Andreassen
User
Автор

You can now see how your code works. It's responsive and have i white overlay. 

I don't want video to be responsive on cell phone. Just centered.

Читать больше
Размещено От Bjorn Andreassen
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Bjorn Andreassen
You can now see how your code works. It's responsive and have i white overlay.  ... ... 

... no! ... my code is not there ...!...  ... section /HEAD, before closing the HEAD tag...

....!... ... there are important errors to eliminate:

.

Читать больше
Размещено От  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... maybe I didn't understand;   ... maybe they are conflicting questions:

Bjorn Andreassen
... ...  I just want the video to be centered and not responsive so that it adjusts to the width.
Bjorn Andreassen
... ... ... I don't want video to be responsive on cell phone. Just centered.

.

Читать больше
Размещено От  ‪ KolAsim ‪ ‪