1. #1
    Membre du Club
    Inscrit en
    février 2011
    Messages
    312
    Détails du profil
    Informations forums :
    Inscription : février 2011
    Messages : 312
    Points : 42
    Points
    42

    Par défaut affichage grande image apres clic sur vignette

    Bonjour

    J'ai une table affichant des images redimensionnées en vignettes
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    <?php 
    $image="COUVER1.gif";
    $chemin ='travaux/'.$image;
    $infos_image = @getImageSize($chemin);
    $largeur = $infos_image[0]; // largeur de l'image
    $hauteur = $infos_image[1]; // hauteur de l'image
    //largeur max souhaitée=100
    $max=100;
    if ($largeur > $max) {
    //calcul du rapport
    $rapport=$largeur/100;
    $newLargeur=$largeur/$rapport;
    $newHauteur=$hauteur/$rapport;
    } 				
    elseif ($largeur == $max) {
    $newLargeur=$largeur;
    $newHauteur=$hauteur;
    }else {
    $newLargeur=$largeur;
    $newHauteur=$hauteur;
    }
    echo '"<a href=\"travaux/COUVER1.gif\"'> '<img alt="" src="travaux/'.$image.'" width="'.$newLargeur.'" height="'.$newHauteur.'">' </a>"';
    ?>
    J'ai une erreur dans la derniere ligne le / de </a> est surligné
    Quand je clic sur une vignette je voudrais afficher l'image dans "Big_img"

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    <td id="Big_img" style="text-align:center;">
    <img src="travaux/COUVER1.gif" />
    </td>

    Est-ce possible
    Merci pour vos réponse

  2. #2
    Modérateur
    Avatar de sabotage
    Homme Profil pro
    Inscrit en
    juillet 2005
    Messages
    23 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme

    Informations forums :
    Inscription : juillet 2005
    Messages : 23 644
    Points : 34 798
    Points
    34 798

    Par défaut

    Il y a trop de guillemets dans ton affaire:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    echo '<a href="travaux/COUVER1.gif"><img alt="" src="travaux/'.$image.'" width="'.$newLargeur.'" height="'.$newHauteur.'"></a>';

  3. #3
    Membre du Club
    Inscrit en
    février 2011
    Messages
    312
    Détails du profil
    Informations forums :
    Inscription : février 2011
    Messages : 312
    Points : 42
    Points
    42

    Par défaut

    Merci pour la correction
    Mais quand je clic sur une vignette cela aaffiche l'image sur une nouvelle page mais pas dans la table

  4. #4
    Expert Confirmé Avatar de RunCodePhp
    Profil pro
    Inscrit en
    janvier 2010
    Messages
    2 963
    Détails du profil
    Informations personnelles :
    Localisation : Réunion

    Informations forums :
    Inscription : janvier 2010
    Messages : 2 963
    Points : 3 907
    Points
    3 907

    Par défaut

    Salut

    Citation Envoyé par Vanessa48
    Mais quand je clic sur une vignette cela aaffiche l'image sur une nouvelle page mais pas dans la table
    Pour ça il faudrait que tu te penche sur du Javascript.

    Grosso modo, lors d'un clic sur un élément de la page (genre un texte ou une image : "Agrandir la photo") cela va afficher la grande image.

    Épluche le Web (google est ton ami), car ce genre de chose foisonne, il y en a tellement qu'on ne sait pas par où commencer, c'est dire.
    Donc c'est impossible de ne pas avoir ne serait qu'un début de piste (voire une solution toute faite).


    Petite parenthèse au passage.
    Redimensionner une image comme tu le fait pour créer une vignette (ou agrandir, peu importe) n'est pas une bonne technique.
    Même redimensionner le poids (Ko ou Mo) reste le même, ce qui est loin d'être très optimisé.

    Une technique parmi tant d'autre consiste à avoir sur son disque (espace d'hébergement) 2 images : Une pour la vignette et l'autre pour la grande.
    (Ce qui suppose que les redimensionnement se feront au préalable).
    Ce n'est que lorsque l'internaute clique sur l'élément "Agrandir l'image" (ou sur la vignette, peu importe) qu'un code JS (genre Ajax) va lancer une requête HTTP pour récupérer la grande image et l'afficher.
    Cette grande image est par ailleurs souvent affichée dans ce qu'on appel une "fausse popup".


    Encore une fois, sillonne le Net, on y trouve absolument tout pour faire ce genre de chose, du plus simple au plus avancé.
    Win XP | WampServer 2.2d | Apache 2.2.21 | Php 5.3.10 | MySQL 5.5.20
    Si debugger, c'est supprimer des bugs, alors programmer ne peut être que les ajouter [Edsger Dijkstra]

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo