affichage sans rechargement

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : affichage sans rechargement

paul1986

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 ;-)

Publicité

xtof_83

Freeride Spirit

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

paul1986

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

tpierron

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

paul1986

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

paul1986

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!

xtof_83

Freeride Spirit

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

paul1986

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 ;-)

FORUM HardWare.fr

Programmation

HTML/CSS

affichage sans rechargement

Sujets relatifs
Problème affichage miniatures VB6	ajouter un JPANEL a l'affichage
PROBLEME D'AFFICHAGE DE DATE DE HEURE EN TEMPS REEL	Insertion et affichage UTF-8 dans base de données
Problème d'affichage d'un JCalendar	Affichage des données dans une position bien défini
Cibler l'affichage d'une image (debutant desolé..)	[Résolu] Affichage variable de champs texte en Dreamweaver
Pb affichage sous ie image background sous menu li	rafraichissement automatique affichage
Plus de sujets relatifs à : affichage sans rechargement

Page générée en 0.050 secondes