rafraichir une image

COLORADO · 20 Février 2007

bonjour,

je voudrais rafraichir une image (png) se trouvant sur ma page web toutes les 15 secondes.

cette image est actualisée sur mon serveur toutes les 20 s par un logiciel (nowplaying) mais il me faudrait une astuce pour rafraichir l'image dans le navigateur.

Actuellement je rafraichis la page web en entier pour recharger mon image mais ce n'est vraiment pas beau ...

Existe t-il une balise ou une astuce pour ne recharger qu'une image en particulier?

merci d'avance pour vos réponses

Anonyme · 20 Février 2007

Non rien. Pas terrible.

ntx · 20 Février 2007

COLORADO a dit:
Existe t-il une balise ou une astuce pour ne recharger qu'une image en particulier?

Il faudrait regarder du côté d'Ajax qui me semble-t-il permet de rafraîchir uniquement une section définie par une balise "div".

p4bl0 · 20 Février 2007

ou tout simplement sans ajax avec le javascript :

Bloc de code:

function update_img() {
    theImage = new Image;
    theImage.src = 'adresse/de/limage.png';
    document.getElementById('id_de_ton_image').src = theImage.src;
    setTimeout(function() {update_img();}, 15000);
}

je ne met pas directement l'adresse de l'image mais je passe par une nouvelle image pour qu'il charge la nouvelle image, sinon certains navigateur vont garder celle qui est en cache.

Si ça ne marche pas alors :

Bloc de code:

function update_img() {
    document.getElementById('id_de_la_div_qui_contient_limage').innerHTML = '<img src="adresse/de/ton/image.png" width="xx" height="xx" />';
    setTimeout(function() {update_img();}, 15000);
}

Si ça marche pas non plus ben attend quelqu'un d'autre

COLORADO · 20 Février 2007

merci pour vos infos,

j'ai donc essayé d'insérrer le code javascript entre les balise BODY de mon code source mais l'image ne se rafraichit toujours pas !

<script language="JavaScript">
function update_img() {
theImage = new Image;
theImage.src = 'nowPlaying.png';
document.getElementById('ipod').src = theImage.src;
setTimeout(function() {update_img();}, 15000);
}
</script>

y a t-il une faute de frappe ?

"nowPlaying" est le nom du fichier image et "ipod" le nom de l'id de l'image.

Quelqu'un peut il ;m'aider

merci

code source visible ici

PA5CAL · 20 Février 2007

Bonjour

Je n'ai pas essayé, mais...

Sans utiliser de JavaScript (qui n'est peut-être pas activé sur le navigateur de certains visiteurs pour des raisons de sécurité), on pourrait peut-être utiliser une balise <iframe> avec dedans une page ne contenant que l'image et un tag d'auto-rafraîchissement de 15s, du style :
<meta http-equiv="refresh" content="15; url=http://kokomo.fr/monimage.html" />

Qu'en pensez-vous ?

p4bl0 · 20 Février 2007

COLORADO a dit:
merci pour vos infos,

j'ai donc essayé d'insérrer le code javascript entre les balise BODY de mon code source mais l'image ne se rafraichit toujours pas !

<script language="JavaScript">
function update_img() {
theImage = new Image;
theImage.src = 'nowPlaying.png';
document.getElementById('ipod').src = theImage.src;
setTimeout(function() {update_img();}, 15000);
}
</script>

y a t-il une faute de frappe ?

"nowPlaying" est le nom du fichier image et "ipod" le nom de l'id de l'image.

Quelqu'un peut il ;m'aider

merci

code source visible ici

met le script entre head et head et ensuite dans <body> tu rajoute

Bloc de code:

onload="update_img()"

Ce que tu pourrai faire aussi c'est de mettre à côté de l'image ceci

Bloc de code:

<em>si vous ne voulez pas que l'image se recharge toutes les 15 secondes, d&#233;cochez cette case :</em> <input type="checkbox" name="img15s" id="img15s" checked="checked" />

Et modifié la fonction update_img() en

Bloc de code:

function update_img() {
    if (document.getElementById('img15s').checked == true) {
        theImage = new Image;
        theImage.src = 'nowPlaying.png';
        document.getElementById('ipod').src = theImage.src;
        setTimeout(function() {update_img();}, 15000);
    }
}

PA5CAL a dit:
Bonjour

Je n'ai pas essayé, mais...

Sans utiliser de JavaScript (qui n'est peut-être pas activé sur le navigateur de certains visiteurs pour des raisons de sécurit&#233, on pourrait peut-être utiliser une balise <iframe> avec dedans une page ne contenant que l'image et un tag d'auto-rafraîchissement de 15s, du style :
<meta http-equiv="refresh" content="15; url=http://kokomo.fr/monimage.html" />

Qu'en pensez-vous ?

moi j'aime pas les frames

bvde · 20 Février 2007

Ajax acvec prototype à la fonction pour toi !
http://prototypejs.org/api/ajax/periodicalUpdater

p4bl0 · 20 Février 2007

juste pour une seul fonction c'est un peu bête de faire charger toute une lib ajax au navigateur, surtout que la c'est tout simple, pas besoin de XmlHttpRequest et tout le bordel

PA5CAL · 20 Février 2007

p4bl0 a dit:
(...)
moi j'aime pas les frames

Mais le site est justement construit sur des frames... alors au point où en est

...

Pour l'instant, la solution proposée n'a pas l'air de marcher. Il faut rafraîchir manuellement la page en cliquant sur le bouton pour voir la nouvelle image quand le titre de la chanson a changé.

Peut-être faudrait-il lancer au moins une première fois la fonction update_img() pour que ça marche...

p4bl0 · 20 Février 2007

PA5CAL a dit:
Mais le site est justement construit sur des frames... alors au point où en est ...

Pour l'instant, la solution proposée n'a pas l'air de marcher. Il faut rafraîchir manuellement la page en cliquant sur le bouton pour voir la nouvelle image quand le titre de la chanson a changé.

Peut-être faudrait-il lancer au moins une première fois la fonction update_img() pour que ça marche...

oui c'est ce que j'ai dit (mettre onload="update_img();" dans <body>).

J'avais pas regardé, mais si effectivement le site est basé sur des frames, alors le truc de la iframe peut être utilisé si jamais le javascript ne marche pas

PA5CAL · 20 Février 2007

p4bl0 a dit:
oui c'est ce que j'ai dit (mettre onload="update_img();" dans <body>).

Oh oui. Je suis distrait, ça m'avait échappé.

COLORADO · 21 Février 2007

finallement j'ai opté pour l'iframe car en javascript ça ne fonctionnait pas (je suis pas très doué).

Merci pour vos conseils

heroe · 21 Février 2007

Bon, j'ai pas grand chose à dire sur le sujet du post puisque
la solution semble avoir été trouvé... :rateau:
mais quand même... très bon bon goût musicaux la Kokomo Radio!

COLORADO · 21 Février 2007

merci

rafraichir une image

COLORADO

Membre confirmé

Anonyme

Invité

ntx

Membre vénérable

p4bl0

Membre expert

COLORADO

Membre confirmé

PA5CAL

Membre expert

p4bl0

Membre expert

bvde

Membre confirmé

p4bl0

Membre expert

PA5CAL

Membre expert

p4bl0

Membre expert

PA5CAL

Membre expert

COLORADO

Membre confirmé

heroe

Membre actif

COLORADO

Membre confirmé

Sujets similaires