affichage sans rechargement

Marsh Posté le 06-09-2007 à 18:34:35

Bonjour, je suis debutant et je souhaiterai savoir s'il est possible d'afficher une image ainsi que ses caractéristiques (nom...) simplement en cliquant sur une miniature, le tout sans recharger la page evidement (trop facil sinon )
Je suis parvenu à faire l'affichage de l'image (javascript) mais pas de ses caractéristiques!
Merci d'avance ;-)

Reply

Marsh Posté le 06-09-2007 à 18:34:35

Reply

Marsh Posté le 06-09-2007 à 20:27:08

caractéristique je sais que c'est possible avec PHP et autres langages serveur. Après...c facile

Reply

Marsh Posté le 07-09-2007 à 00:09:39

oui, ca devrait aller, mais mon probleme est d'afficher le tout sans recharger la page!!!! et là je seche pour afficher le texte...

Reply

Marsh Posté le 07-09-2007 à 01:46:11

Bah, tu utilises l'API DOM pour construire ce dont tu as besoin. genre :

var div = document.createElement("div" )
var img = document.createElement("img" )

img.src = "url_de_ton_thumb"

div.appenChild(img)
div.appendChild(document.createTextNode("Les infos de ton image" ))
div.className = "info_thumb"

document.body.appendChild(div)

Tu mets ce code dans une fonction que tu attaches à l'événement onclick de ton élément et pouf tu utilises ensuite du CSS (en ciblant div.info_thumb) pour afficher ton cadre comme tu le veux.

Bon c'est brut de fonderie, mais l'idée est là. Le W3C est ton ami pour comprendre la signification de ces fonctions, somme toute archi-classique.

Message édité par tpierron le 07-09-2007 à 01:46:48

Reply

Marsh Posté le 07-09-2007 à 11:07:50

ok !!!! je vais bosser ca merci, c'est exactement le genre de piste que je cherchais !!
merci encore!

Reply

Marsh Posté le 07-09-2007 à 15:45:31

après avoir reflechie quelque peu, j'ai trouvé une solution:

<html>
<head>

<script>
var Bigimg
var dest
function image(dest){
Bigimg=document.getElementById("Bigimg" );
Bigimg.src=dest
}

var nom
function nomp(nom)
{
var obj = document.getElementById("champ_input" )
obj.value=nom
}

var val
function marquep(val)
{
var obj = document.getElementById("champ_marque" )
obj.value=val
}
</script>
</head>
<body>
...
echo "<img src='$imamgeexif' height=100 onmouseover=(style.cursor:hand) onmouseout=(style.Cursor:pointor) border='0' onclick='nomp('$photos[$i]'); image(this.src); marquep('$marque');'>";
...
</body>

le probleme, c'est que quand je clic, rien ne se passe, pourtant lorsque je retire nomp('$photos[$i]') et marquep('$marque') ca marhe pour l'affichage de la photo... ou est l'erreur ? (j'ai essayer de remplacer les ' par " mais rien n'y fait!

Reply

Marsh Posté le 07-09-2007 à 17:38:44

Code :

nomp('<?php echo $photos[$i];?>')

Comment tu veux qu'il sache sinon que c du php :non:

Sinon met des ";" à fin de chaque, JS c permisif, mis bon ça fait pas de mal

Reply

Marsh Posté le 07-09-2007 à 18:03:53

ok, les <? etait avant et après le echo ?>
le probleme venait du fait que je me suis emmelé dans les ' que j'ai finalement remplacé par \" bref ca marche à present merci à tous ;-)

Reply

affichage sans rechargement

Sujets relatifs:

Leave a Replay