Image survolée agrandie

Résolu
Bonjour,
J'ai fait des textes agrémentés de photos dans mon site, sur ces photos j'aimerai au passage de la souris que la photo s'affiche agrandie, sans ouvrir d'autre fenêtre, j'utilise dreamweaver 8, merci pour votre aide
Configuration: Windows XP pro Internet Explorer 8.0

8 réponses

  1. Une autre solution est d'afficher une « infobulle » en Javascript (une cadre qui suit la souris, contenant du texte, une image, ...).
    Regarde ici (demo)
    1. Bonjour avion-f16
      merci pour tes liens et ton mail, mais comme je ne suis qu'un dabutante, je n'ai pas su placer les codes à l'endroit voulu où se trouve mon image, snif
  2. J'ai gardé "Hollandais Volant" et on garde "Hollandais Volant", car en 1680, date de départ d'Amsterdam du navire (dont le capitaine est Hendrik Van Der Decken (faut bien que je fasse péter^^)), le pays se nommait "Royaume de Hollande", avant de devenir les Provinces Unis, puis "Nederland".

    Pour info, "Holland = Hol-Land = Pays Creux (les 25% des P-B qui sont en dessous du niveau des océans sont surtout en Hollande)
    Et Nederland = Neder-Land = Pays-Bas (littéralement).

    On me surnomme depuis assez longtemps le hollandais volant, mais depuis la sortie de POTC-2, je dois dire que j'ai porté ce nom plus souvent^^

    Et comme le personnage est très connu (il apparait dans nombre de dessins animés (Bob l'éponge notamment, et y'a des allusions dans Pokémon), bien sur dans POTC !

    *POTC = Pirates des caraïbes (Pirates Of The Carribbean)

    Pour des infos sur la légende du navire fantôme, c'est là. Une très belle page. Et l'explication du pourquoi le navire est justement devenu fantôme, et la super déclaration du capitaine qui mit Dieu en rage :

    Ma route étant tracée et ma course décidée, je défie la puissance de Dieu de les entraver. Et même le Suppôt de l'Enfer n'éveillera pas ma frayeur, dussé-je naviguer jusqu'au jour du jugement.


    Personellement, j'adore les truc de pirate et particulièrement cette légende. Même si je ne croix guère au paranormal, rêver de temps en temps ne fait pas de mal :-))
    1. Je ne suis pas tout à fait Hollandais, mais Néerlandais (de nationalité). La Hollande n'est qu'un département des Pays-Bas, au même titre que l'Allier est un département français.

      On confond souvent les deux, un peu comme Angleterre/ Grande-Bretagne / Royaume Uni.

      1. Ah ben mince, je croyais que tu étais un pirate des Caraïbes :)
      2. Bonjour
        ton histoire m'a beaucoup interessée, et pour cause, un de mes ancêtres etait dans un bateau de christophe colomb en 1492, un autre a participé au combat de la guerre de trafalgare et oui avec la généalogie c'est fou ce que l'on peut trouver mais c'est un autre sujet je ne voudrais pas abuser sur ce forum
        Encore merci pour ton aide
    2. Le CSS doit être placé en haut de ton document, dans le <head> dans un <styles>.

      Le HTML, à l'endroit où tu veux qu'ils apparaissent.
      1. Bonjour le Hollandais, bien noté, merci, au fait je ne sais pas si tu es hollandais, mais j'y suis allée il y a quelques années et j'ai adoré ce pays,
    3. Tu ne dois pas copier/coller les codes bêtement dans DW comme ton contenu.
      Les scripts sont à placés quand tu es en mode "code source".
      1. mais oui Avion ça je sais je me mets en code source, mais c'est pour placer le code, je me mets où???
        merci encore, encore faut-il savoir quoi lui dire, lol
    4. D'autres sont là : en CSS : image s'affiche au clic.

      Le dernier exemple de la page : là.

      J'ai tout expliqué sur cette page : là!.
      1. Bonjour hollandaisvolant
        très interessant ton site et tes liens, et j'aime bien l'effet d'affichage de ton image en cliquant dessus, seul probème comme je le disais à avion-f16 je suis très, mais très débutante avec dream et je n'ai pas su placer les codes à l'endroit voulu
        1.les caractères apparaissent dans le texte donc il manque quelque chose mais quoi????
        2.
        3.
        4.
        5.
        6.
        7.
        8.
        9.
        10.
        11.
        12.
        13.
        14.
        15.
        16. div.popup {
        height: 140px;
        width: 120px;
        }
        div.popup > img {
        height: 100%;
        width: 100%;
        cursor: pointer;
        }
        div.popup > img:active {
        height: auto;
        width: auto;
        position: absolute;
        border: black solid 1px;
        }
    5. Contributeur
      tu peux toujours couper ton texte aprés x caracteres:

      $text = wordwrap($ton_texte, 100, "\n");

      attention, ce code est simple, c' est a dire que si au bout de 100 caracteres ca tombe au milieu d' un mot, ca le coupera quand meme au lieu de couper juste avant de mot, mais il est améliorable.

      Change juste $ton_texte et 100 qui est le chiffre ou le texte sera coupé aprés.
      1. Bonjour graffx
        Merci à toi aussi pour ton aide, vaiment vous êtes super sympas, merci
    6. Salut,
      Voila un exemple rapidos

      <img src="URL VERS L'IMAGE" alt="" width="100" height="100" onmouseover="this.width=200;this.height=200" onmouseout="this.width=100;this.height=100" />


      width = largeur de l'image retrecie
      weight = hauteur de l'image retrecie

      this.width=200 = la taille que tu veut qu'elle ai en large une fois develloper
      this.height=200 = idem hauteur

      this.width=100;this.height=100 > remettre les valeurs de width et weight

      Voila donc une petite piste, a voir donc du coter du javascript et des proprietés onmouseover et onmouseout
      1. Anamos67 tu es génial, merci de tout coeur, très vite fait et facile, ouf, j'ai galéré 2 jours avec ça, dans le même genre de facilité, le fond que j'ai mis est trop court, lorsque mon texte est trop long j'avais des des fleches pour aller à la page suivante, n'y a-t-il pas 1 moyen pour que le fond s'adapte à la longueur du texte stp, merci très sincèrement, mon dimanche s'est éclairci grâce à toi, je voudrais trouver une personne qui me depanne même en payant 'pas trop cher lol) comment avoir ton mail perso?
      2. @marieoceaneinscris toi sur le forum puis par message privé pour le mail perso. Du reste graffx ta fourni une réponse
      3. @Anamos67Anamos67
        mais je suis inscrite, je viens d'essayer à nouveau et on me dit que mon pseudo est pris, je crois bien être inscrite, comment véridier??? merci encore
      4. @marieoceaneTu est marquer en anonyme sur le forum donc je suppose non identifier, donc pas de mp
      5. @Anamos67Bonjour Anamos67, je vais essayer de rectifier, merci