Hi there, community. We are building our new home page on Webflow and are trying to put a autoplay video on our hero banner (link: http://memed-beta.webflow.com/ ) but when we go through the link, a few seconds before the video starts, a black screen appear on it. Screen 1 (Black Screen) [image] …

depends on the size of the video. large videos / hq videos take longer to download / stream. also depends on your connection and server availability… and everything between you and server. I use the method you stated. Create a div - put a background image (of the video) in to the div. That way… t…

Hi @ricamoraes , thanks for the post. I think that @Revolution is right, that it could be the size of the video, I noticed that you were using a .mov file for an .mp4 source link, and that video was 2.7mb which is quite large for a video for background purposes. I have converted as an example, your…

Hi, @cyberdave . Thank you a lot for your answer. The link you’ve sent didn’t open… Can you send it again, please? I wanna try with your test… this should work! :smile:

Tks, @Revolution . Probably the problem is only the size of the video… Im gonna make a test with a smaller file and this should work. Thanks again, buddy. Cheers, Ricardo.

hi @ricamoraes , can you try this link: https://www.dropbox.com/s/mrsr28996lbzlsp/hero_1.mp4?dl=0 See if that works? Cheers, Dave

Hi, @cyberdave . We tried use your resized video, but it doesn´t work either: http://beta3.memed.com.br The black screen still on it… I received your email today, and Im replying here. If you have any other guess, would love to know. Cheers, Ricardo.

Hi @Ricardo , currently the link you provided was to the https location of the file. Could you point your url at the non-https location of that dropbox file to see if it makes a difference? You can use a dropbox link from a file uploaded to your public folder, but when inserting that link into the …

Hey, @cyberdave . Tks for you reply again. We already embed the video on this link: <source src="http://dl.dropboxusercontent.com/u/1942273/_drop%20files/hero_1.mp4" /> Isn’t it enough? Cause, when I click on it, goes to the “https” again… But the source is only “http”…

Hi, when I look at your page, I see the hero video, but it has a different file name: <source src="http://dl.dropboxusercontent.com/u/1942273/_drop%20files/hero_1.mov"> This was on the page http://beta3.memed.com.br/ Could you check that, and make it so the .mp4 loads up and then will take a furt…

@cyberdave , problem solved! The issue wasn’t the “https” or the size of the video. We only needed to describe the “poster video”, wich was an image, then the video comes on autoplay.

Auto Play Videos on Hero Banner

Design help General

Topic		Replies	Views
Background video responsive size General	24	23759	November 2, 2023
Sizing a background video General	20	30436	March 29, 2024
Full screen HTML5 background video Webflow Tips	6	6536	February 22, 2022
Simple responsive Video embed for background videos General	6	1471	March 24, 2023
Complete custom code for full browser HTML5 video background General	10	9292	July 5, 2015

Auto Play Videos on Hero Banner

Related topics