[HTML/CSS] Skrytie Canvasu, kým sa nenačíta

Programovacie jazyky, rady, poradňa...
Hensym
VIP
VIP
Používateľov profilový obrázok
Príspevky: 6978
Registrovaný: 24 apr 2011, 0:53
Bydlisko: Zvolen

[HTML/CSS] Skrytie Canvasu, kým sa nenačíta

Príspevok od používateľa Hensym »

Ahojte, mám jednoduchú stránku, ktorá má navrchu Canvas o výške asi 300px a šírke 100%. Tento canvas načítava súbory veľké asi 10mb, čiže mu chvíľu trvá, kým sa načíta. Je nejaký spôsob, ako takýto canvas skryť nad vrchom stránky, a akonáhle sa načíta, tak sa pomocou CSS animácie plynulo spustí dole a spolu s ním sa nižšie posunie aj celý obsah pod ním?

Ďakujem. :)

//autoeditácia príspevku (15 Jan 2015, 14:57)
// tak zbytočná téma, už som to vyriešil pomocou slideDown() v jQuery. :)
Michaelo
Hardcore addict
Hardcore addict
Používateľov profilový obrázok
Príspevky: 6177
Registrovaný: 16 júl 2008, 20:29
Bydlisko: Pri PC
Kontaktovať používateľa:

Re: [HTML/CSS] Skrytie Canvasu, kým sa nenačíta

Príspevok od používateľa Michaelo »

No kod si tu nedal :)

Kód: Vybrať všetko

<canvas id="myCanvas" style="width: 100%; height: 300px;"></canvas>

<script>
$(document).ready(function() {
	var canvas = document.getElementById('myCanvas');
	var context = canvas.getContext('2d');
	var imageObj = new Image();
	imageObj.src = 'http://www.spacetelescope.org/static/archives/print_posters/large/hst_print_poster_0012.jpg';
	$("#myCanvas").hide();

	imageObj.onload = function() {
		$("#myCanvas").slideDown(3000);
		context.drawImage(imageObj, 0, 0);
	};
});
</script>
https://qb.erahier.sk/test.php
Napísať odpoveď