Hero video to mobile image flicker!?

Hi all,

I did a post about mobile view on hero video showing a play button but this has now vanished! (I’m either going crazy….or my 1 beer was stronger than it said!) So I’ve edited my post about the other ( thanks @PeteSharp & @Jerry )

I need to create a hero bloc with an image on mobile, which does not load the video to speed mobile data use, there was a post @flashman did which highlighted this very well - I did all that was asked and @Norm said to remove the smaller breakpoint in the layer tree - which I did and added the poster image, this works to a certain degree - but this has a huge problem too - on loading the home page on Safari - the Hero flashes the Poster Image for a split second and then loads the video…this is not something I can have.

@Norm - your solution on the below link, is there a way to make it so the poster image does not flash in for a second before the home page loads!

Cheers all.

EDIT: Just made a demo https://demo.backituplive.com

Demo link plays video for me no problem. (iPhone)

2 Likes

Works for me as well…
ScreenFlow (1)

1 Like

Thanks for testing - this is crazy!!! I spent 2hrs with this last night……on wifi and mobile data. My phone & my wife’s (it was my wife that spotted the issue) I found 3 blocs websites that did the same issue & mine did and on my test one.

Just woke up (4.30am) - checked the forum, you guys tested / I just clicked the link & BOOM - the video is playing on mobile.

Now Im either going crazy or something strange is happening!!!

I’m gonna edit my original post now as the post serves no point!!!

I vote you’re crazy :crazy_face::crazy_face::crazy_face:

2 Likes

I agree!!! I’m going back to sleep as I strongly belive this is one huge dream & when I wake up none of this exists! :sleeping::zzz:

1 Like

When you wake up the Apple Studio display is great and $500 cheaper too :grin::joy::joy:

1 Like

Nope! it was 100% real !..lol…i just opened Chrome on my iPhone and there it was - the play button on mobile of the Hero - then all of a sudden it disappeared and the video started to play.
At least i know im not going mad !

But would still like to sort out how to make an image on the mobile view work smoothly and not flash open on the desk top view.
Also would like to know if I did do an image on the mobile view this way - does it disable the video load time on mobile? if not - no point in changing !

you can use the page transition bric to soften the load. I use that and disable the preloaded.

Hi @PeteSharp - yeah I have been using that on the original website I am working on, love to use that instead on a pre-loader.

I have applied it to the one im playing with and added some more time and still no good. If you click on the link at the top, it still flashes the mobile image up.

https://demo.backituplive.com

Use a class to set the image on the bloc…

Select the SM breakpoint, drag the image to the image well of the class. The breakpoints above should not show the image.

1 Like

Brilliant !!! - applied this and works perfect !!! Thank you !!! - do you know if this try’s to load the video on mobile in the background though? even if we do not see it?

I use this with all my sites.