Jump to content
×
×
  • Create New...
  • Please do not post a message for the purpose of insulting, incitement to hatred, sexual remarks and any other which does not respect our terms of use !

 addons Maintenance vidéo


Harda
 Share

Recommended Posts

Holà les kinders !

Bon, je vois des personnes qui cherchent comment mettre des vidéos en background, j'ai la solution ! :troll:

Je vous share donc une petite maintenance toute simple mais plutôt utile que j'ai fais.

Vous aurez besoin de télécharger une vidéo que vous renommerez video et format mp4 bien sur, et la placer la ou ce trouveras le fichier index.php.

Bref, la voici:

Lien de test: ici

Code tout en un (css+html):

<!DOCTYPE html>
<html>
	<head>
		<title>Video Background</title>

		<style type="text/css">
			
			* {
				margin: 0;
				padding: 0;
			}

			body {
				font-family: Calibri, sans-serif;
			}

			.background-wrap {
				position: fixed;
				z-index: -1000;
				width: 100%;
				height: 100%;
				overflow: hidden;
				top: 0;
				left: 0;
			}
			
			#video-bg-elem {
				position: absolute;
				top: 0;
				left: 0;
				min-height: 100%;
				min-width: 100%;
			}


			.contenue {
				position: absolute;
				top: 0;
				left: 0;
				min-height: 100%;
				min-width: 100%;
				background-color: rgba(0,0,0,0.7);
			}
			.contenue h1 {
				text-align: center;
				font-size: 65px;
				text-transform: uppercase;
				font-weight: 300;
				color: #fff;
				padding-top: 15%;
				margin-bottom: 10px;
			}
			.contenue p {
				text-align: center;
				font-size: 20px;
				letter-spacing: 3px;
				color: #aaa;
			}

			
		</style>
		
		
	</head>
	<body>
		
		
		

		<div class="background-wrap">
			<video id="video-bg-elem" preload="auto" autoplay="true" loop="loop" muted="muted"> 
				<source src="video.mp4" type="video/mp4">
				Vidéo non supporté
			</video>          
		</div>


		<div class="contenue">         
			<h1>Maintenance Simple</h1>
			<p>Nous sommes actuellement en maintenance, on revient bientot...</p>
		</div>

        

	</body>
</html>

Je p

                           Skype: Harda Web

                          Snap: rmaanmbg

311175hardahdev.png

Link to comment
Share on other sites

Il y a 10 heures, Alexis a dit :

Meeerci ! :)

Y'a pas de quoi

 

Il y a 5 heures, Romaric a dit :

Merci , sympa  la base !

Merchii

                           Skype: Harda Web

                          Snap: rmaanmbg

311175hardahdev.png

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share