Image d'attende pendant le chargement script php

Anonyme

17 février 2010 à 1:59:10

Bonjour

J'ai un script qui upload une image puis la modifie et c'est asser long (5 seconde

)

J'aimerais affiche une image pour faire "patienter" le visiteur, pendant que php travail.

Comment faire ?

Merci

Prokopy

17 février 2010 à 2:04:01

Salut,

Comme le navigateur garde la page web du départ pendant que PHP travaille, l'astuce serait d'utiliser du JavaScript pour faire apparaître un texte du genre "Traitement en cours ... Merci de patienter ..." quand on clique sur le bouton, et oui pourquoi pas une image.

AddiKTiV

13 mars 2010 à 16:55:27

Salut,

En fait c'est assez simple.

Tu crée une div cachée qui contiendra ton image

Par exemple :

<style type="text/css">
<!--   
#cache { position: absolute; top: 200px; z-index: 10; visibility: hidden; width: 100px; height: 100px; }
-->
</style>

<div id="cache" align="center">
	<!-- image à générer sur l'excellent site : http://www.ajaxload.info/ -->
	<img src="ajax-loader.gif">
	<!-- image à générer sur l'excellent site : http://www.ajaxload.info/ -->
    <br />
    Chargement en cours ...
</div>

Ensuite dans ta page à charger, juste en dessous de la balise </body>, il faut mettre un petit bout de JavaScript qui va se charger d'afficher ou de masquer ta div.

Perso j'utilise ce bout de script

<script language="JavaScript">
var nava = (document.layers);
var dom = (document.getElementById);
var iex = (document.all);
if (nava) { cach = document.cache }
else if (dom) { cach = document.getElementById("cache").style }
else if (iex) { cach = cache.style }
largeur = screen.width;
cach.left = Math.round((largeur/2)-200);
cach.visibility = "visible";

function init()
	{
	cach.visibility = "hidden";
	}
window.onload = init
</script>

Ensuite tu n'as plus qu'a changer l'aspect ...

Shantees

13 mars 2010 à 17:14:01

Beaucoup de js pour rien..

il suffit de placer avant </body>

<script language="javascript">document.getElementById("divchargement").style.display='none';document.getElementById("divpage").style.display='block';</script>

Mamatt

15 mars 2010 à 18:11:39

Bonjour j'ai un problème un peu près similaire, j'ai un formulaire pour uploadé des gros fichiers, et je voudrais qu'un gif s'affiche pendant l'upload, j'ai essayé le code détaillé plus haut, mais rien n'a l'air de marcher.

Dans mon cas, faudrait il pas lancer le code java lors du click : onClik sur le bouton submit ??

je dois mettre le script java sur qu'elle page, la page ou est inscrit mon formulaire ( ou se situe la balise form) ou la page appelé dans le formulaire ?

merci

Shantees

16 mars 2010 à 2:43:09

Non toi dans ton cas faut faire l'upload en ajax...

Voir swiftuploader

Mamatt

16 mars 2010 à 10:38:44

peut tu me mettre un lien vers un tuto ou un script avec cette démarche en Ajax stp, je fouille mais je trouve rien, j'ai trouvé un cours AJAX sur le site mais pas grand chose d'autre, merci

Shantees

16 mars 2010 à 18:17:02

http://files.codes-sources.com/fichier [...] .Uploader.swf

anne64

14 septembre 2010 à 9:32:42

Bonjour, j'ai essayer d'utiliser la méthode AddiKTIV mais rien a faire ca marche pas!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
	<meta http-equiv='Content-Type' content='text/html; charset=iso-8859-1' />
<style type="text/css">
  
#cache { position: absolute; top: 200px; z-index: 10; visibility: hidden; width: 100px; height: 100px; }

</style>
</head>
<body>
<div id="cache" align="center">
	<img src="loading.gif">
    <br />
    Chargement en cours ...
</div>

<div id='visible'>
<?php include('test.php'); ?> <!--Mon script à charger-->
</div>


</body>
<script language="JavaScript">
var nava = (document.layers);
var dom = (document.getElementById);
var iex = (document.all);
if (nava) { cach = document.cache }
else if (dom) { cach = document.getElementById("cache").style }
else if (iex) { cach = cache.style }
largeur = screen.width;
cach.left = Math.round((largeur/2)-200);
cach.visibility = "visible";

function init()
	{
	cach.visibility = "hidden";
	}
window.onload = init
</script>
</html>

Pourquoi ca marche pas?

wassgha

14 septembre 2010 à 9:44:45

Voici le code que j'utilise:

<html>
     <head>
	<script src="http://code.jquery.com/jquery-1.4.2.min.js" /></script> 
	<script> 
	function addLoadEvent(func) {
	  var oldonload = window.onload;
	  if (typeof window.onload != 'function') {
		window.onload = func;
	  } else {
		window.onload = function() {
		  if (oldonload) {
			oldonload();
		  }
		  func();
		}
	  }
	}
	addLoadEvent(function() {
		$("#loading").fadeOut(1000);
	});
	/*
	$(document).ready(function() {
			$("#nav").fadeIn(3000); 
			$("#main").fadeIn(3000); 
	});
	*/
	</script> 
	<style>
	#loading {
		width: 100%;
		height: 100%;
		background-color: #000;
		opacity: 0.8;
		filter:alpha(opacity=80);
		position:fixed;
		text-align: center;
		color:#FFF;
	}
	</style> 
     </head>
     <body>
         <div id="loading"><br><br>Please wait...</div> 
     </body>
</html>

Et ça donne un super effet (avec jQuery)

samsamjeanbaptiste

25 mai 2013 à 11:44:41

sest bien mes sa disparait pas

FranckyMossa

13 décembre 2017 à 8:57:10

Bonjour je dmande si qlq'un pourrais bien m'aider en utilisant le timer en php

xoxotf

13 décembre 2017 à 11:25:40

FranckyMossa a écrit:

Bonjour je dmande si qlq'un pourrais bien m'aider en utilisant le timer en php

Joli déterrage est hors sujet au passage o_O

Il n'y a pas de timer à proprement parler en PHP, tu peux sauvegarder le moment actuel dans une variable, faire ce que tu as à faire puis à la fin récupérer le temps une fois de plus pour ensuite comparer la première variable avec la deuxième ce qui te donnera le temps écoulé entre les deux exécutions. (Voir microtime ou time)