[JavaScript][AJAX][PHP] Odtwarzanie mp4 w tle, wymiana fragmentu kodu Opcje

[shpaque]

Witam serdecznie, szukałem, ale konkretnie tego tematu nie znalazłem, więc piszę.

Jak wiadomo coraz więcej stron odtwarza w module "hero" w tle pliki video. Jak zrobić, żeby moj video background był odtwarzany w formacie mp4 wszedzie, a nie tylko w safari?

mam to zrobione po prostu tak

[HTML] pobierz, plaintext 
<div class="video-bg-container">
		<video class="bloc-video" preload="auto" loop="loop" autoplay="autoplay">
			<source src="vid/woda.mp4" type="video/mp4" />
		</video>
	</div>
[HTML] pobierz, plaintext 

w css nie wiem czy to wazne, jest tak

[HTML] pobierz, plaintext 
.video-bg-container, .bloc-video{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	right: -50%;
	overflow: hidden;
	transform: translateX(-50%);
	-webkit-transform:translateX(-50%);
}
.bloc-video{
	width: auto;
	height: auto;
	min-width: 100%;
	min-height: 100%;
	z-index: 0;
}
[HTML] pobierz, plaintext 

@edit


To może ugryźmy to inaczej. Program wrzuca jedynie pliki mp4, ktore jak wiemy nie ciagna wszystkie przeglądarki. Znalazlem pewne rozwiazanie, ale przy generowaniu strony program oczywiscie wygeneruje kod, w ktorym będzie wycinek:

[HTML] pobierz, plaintext 
<video class="bloc-video" preload="auto" loop="loop" autoplay="autoplay">
			<source src="vid/water.mp4" type="video/mp4" />
		</video>
[HTML] pobierz, plaintext 

jak zrobic (jQuery pewnie) zeby w locie przy generowaniu strony, czyli gdzies skryptem na dole strony - żeby pozmienil mi kod z powyzszego na:

[HTML] pobierz, plaintext 
<video class="bloc-video" preload="auto" loop="loop" autoplay="autoplay">
			<source src="vid/water.ogg" type="video/ogg" />
			<source src="vid/water.webm" type="video/webm" />
			<source src="vid/water.mp4" type="video/mp4" />
		</video>
[HTML] pobierz, plaintext 

czyli inaczej jak zrobic funkcja jQuery (lub jak inaczej) zeby w czasie ladowania strony podmienic czesc kodu?

Ten post edytował shpaque 15.08.2017, 11:58:03

[shpaque]

blocs - tak jak napisalem powyzej - generalnie chyba mniej wiecej o to mi chodzi ale nie wiem dlaczego nie dziala (jest w headzie calosc)


oj juz pochrzanilem wszystko, chodzi mi o to:

[HTML] pobierz, plaintext 
<script>
function zamianaKodu() {
    var kod = '<source src="vid/water.mp4" type="video/mp4" />';
    kod = str.replace('<source src="vid/water.mp4" type="video/mp4" />', '<source src="vid/water.ogg" type="video/ogg" /> <source src="vid/water.webm" type="video/webm" /> <source src="vid/water.mp4" type="video/mp4" />');
}
window.onload = zamianaKodu;
</script>
[HTML] pobierz, plaintext 

@edit

tak jak myslalem, udalo sie jQuery, ale dodaje mi na stronie we "wklejonym" odcinku cudzyslowy na poczatku i koncu - jak to wyeliminowac?

[HTML] pobierz, plaintext 
<script>
$(function(){
    $(".bloc-video").text('<source src="vid/water.ogg" type="video/ogg" /> <source src="vid/water.webm" type="video/webm" /> <source src="vid/water.mp4" type="video/mp4" />');
});
</script>
[HTML] pobierz, plaintext 

https://www.dropbox.com/s/in9uzv7a2tvrd8x/replaced.jpg?dl=0


@edit 2

i już załatwione "dziękuję" za ogromną pomoc. Chodziło nie o "text" tylko "replaceWith"

teraz prawidłowo wygląda to tak:

[HTML] pobierz, plaintext 
<script>
$(function(){
    $(".bloc-video").replaceWith('<video class="bloc-video" preload="auto" loop="loop" autoplay="autoplay">\n<source src="vid/water.ogg" type="video/ogg" />\n<source src="vid/water.webm" type="video/webm" />\n<source src="vid/water.mp4" type="video/mp4" /></video>');
});
</script>
[HTML] pobierz, plaintext 

temat do zamknięcia.

Ten post edytował shpaque 15.08.2017, 14:34:35