Show video in the homepage background

Hi guys,

I wonder why our website is showing the video in the background by Firefox and Chrome but not from IE11, MS Edge.

This is little tricky, I'm trying to find the solution by myself but hopefully you have some experience on this :)

Thank you!
Miguel QuintanaAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Najam UddinCommented:
Browser mode and document mode need to be IE9 and IE9 Standards mode for <video> to work. Video should MPEG-4, and some times size matters.
0
Miguel QuintanaAuthor Commented:
Can you please explain more detailed based on the video embed and tags present on my homepage?  I'm playing mp4 video indeed

What do you mean with browser/document mode?

Thank you
0
Najam UddinCommented:
Can you please explain more detailed based on the video embed and tags present on my homepage?
You didn't shared details of tags present on you homepage.

2. Press F12, developer tool will open up for browser and in Emulation you will find these options
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

Miguel QuintanaAuthor Commented:
<div id="videotag">
				<video autoplay="" loop="" muted="" poster="/es/../images/header.jpg" id="video-bg"> 
					<!--<source src="/es/video.webm" type="video/webm"> -->
					<source src="https://s3-eu-west-1.amazonaws.com/dow/video-entrada-2.mp4" type="video/mp4"> 
				</video>
</div>

Open in new window


@media (max-width: 2300px) and (min-width: 1280px)
#video-bg {
    visibility: visible;
    width: 105%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
audio, canvas, video {
    display: inline-block;
}
user agent stylesheetvideo {
    object-fit: contain;
}
0
Miguel QuintanaAuthor Commented:
Video tag and video format is not the problem.

I just test it and video is being showing properly:

http://www.nacsport.com/es/testvideo.php


The problem seems to be around the CSS rules
0
Miguel QuintanaAuthor Commented:
I just found the solution by myself and the problem with Internet Explorer was due some layers containing the video with background color assigned... it was not a compatibility issue.

I just deleted these properties in the CSS and now the video is being showing in the background http://bit.ly/1NOS1LQ

Thank you
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Martin LissOlder than dirtCommented:
This question has been classified as abandoned and is closed as part of the Cleanup Program. See the recommendation for more details.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.