Forum PHP.pl

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

Czemu nie mozesz tego html wygenerowac poprawnie jeszcze na poziomie php?

bo nie chce przy kazdym wygenerowaniu strony pamietac zeby edytowac kod, wolalbym po prostu generujac caly web miec wszystko tak zrobione zeby juz nie edytowac gotowych podstron, a program nie umozliwia edycji kodu, a jedynie dodanie gdzies w tresci kodu lub w naglowku lub w stopie



mam tak: i dlaczego nie dziala?

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

Ten post edytował shpaque 15.08.2017, 12:25:16

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