infobulle en javascript (Créer un compte)

Accueil › Forums › Extensions › infobulle en javascript
  • Statut : non résolu
15 sujets de 1 à 15 (sur un total de 15)
  • Auteur
    Messages
  • 4 avril 2008 à 14 h 12 min #458465
    romk
    Participant
    Padawan WordPress
    60 contributions

    Bonjour,

    Ma configuration WP actuelle
    – Version de WordPress : 2.3.1
    – Thème utilisé : N.Design Studio
    – Plugins en place : Configurable Tag Cloud, Akismet, No Self Pings, post2pdf, Simple Tags, WP-Digg Style Paginator, WP lightbox 2, Tiger Style Administration.
    – Nom de l’hebergeur : OVH
    – Adresse du site : http://romk.fr

    Problème(s) rencontré(s) : je cherche un plugin qui me permette d’afficher une popup contenant un texte au survol de la souris sur une image. Comme sur cet exemple.

    Merci.

    4 avril 2008 à 15 h 48 min #626544
    dlo
    Participant
    Maître WordPress
    1849 contributions

    Utiliser l’attribut alt de la balise img n’est pas suffisant ?

    Le code html suivant fait apparaître une info-bulle contenant « Coucou ! » quand on passe le curseur sur l’image:

    <img src="/mesimages/image.jpg" alt="Coucou!" />

    Cordialement

    4 avril 2008 à 15 h 51 min #626545
    romk
    Participant
    Padawan WordPress
    60 contributions

    ben non, j’aurais préféré utiliser quelque chose de plus ‘différent’ en fait. Et de pouvoir personnaliser un peu plus le popup.

    4 avril 2008 à 17 h 34 min #626546
    Geeko
    Participant
    Initié WordPress
    18 contributions

    Tu peux le faire en css. Le javascript ne fera qu’alourdir tes pages et ne sera pas visible pour environ 10% des visiteurs.

    4 avril 2008 à 18 h 21 min #626547
    romk
    Participant
    Padawan WordPress
    60 contributions

    ha oui, en CSS ? comment je peux faire ça ? vous pouvez me donner une piste ? :happy:

    4 avril 2008 à 19 h 02 min #626548
    IPreferNcy
    Membre
    Chevalier WordPress
    176 contributions

    tu connais Google ? 😗
    http://dypso.free.fr/tech/css_infobulle.php

    4 avril 2008 à 22 h 39 min #626549
    romk
    Participant
    Padawan WordPress
    60 contributions

    Super, merci.

    Juste une dernière petite question, comment faut t’il faire pour que la largeur du bloc soit ajustée automatiquement par rapport au texte qu’il contient ?

    Merci.

    5 avril 2008 à 8 h 56 min #626550
    IPreferNcy
    Membre
    Chevalier WordPress
    176 contributions

    Si je ne m’ abuse, background-repeat:repeat-y devrait faire ton bonheur 🙂
    http://www.w3schools.com/css/css_background.asp

    7 avril 2008 à 9 h 36 min #626551
    romk
    Participant
    Padawan WordPress
    60 contributions

    Non, « background-repeat:repeat-x » ne fonctionne pas.

    N’y a t’il pas un moyen de définir la largeur que prend le texte (text.width) par exemple ?

    7 avril 2008 à 10 h 43 min #626552
    Geeko
    Participant
    Initié WordPress
    18 contributions

    Si. Va voir les pages sur un de mes sites, http://www.libellulesmaizieres.fr/zygoptera/zygoptera.html par exemple (pointeur sur la petite image sous le titre du nom d’espèce pour afficher une carte à gauche), et regarde le css. Spécifier « width » suffit.

    a.tooltip:hover em { 
    font-style : normal; 
    display : block; 
    position : absolute; 
    top : -145px; 
    left : -220px; 
    padding : 5px; 
    color : #cccccc; 
    border : 1px solid #bbb; 
    background : #181821; 
    width : 200px; 
    }

    7 avril 2008 à 10 h 50 min #626553
    romk
    Participant
    Padawan WordPress
    60 contributions

    :happy: Merci pour cet exemple. Mais je pense m’être mal exprimmé !

    En fait, je souhaite que ce soit le texte qui influence la largeur de la boite et non la boite qui formate le texte.

    par exemple : pour le contenu « un texte« , la boite sera petite ET pour le contenu « voici du texte dans la boite« , la boite sera plus grande.

    7 avril 2008 à 15 h 17 min #626554
    Geeko
    Participant
    Initié WordPress
    18 contributions

    T’as essayé

    width: auto

    ? :D

    7 avril 2008 à 15 h 25 min #626555
    romk
    Participant
    Padawan WordPress
    60 contributions

    ouaip, marche pas non plus.

    7 avril 2008 à 16 h 43 min #626556
    Geeko
    Participant
    Initié WordPress
    18 contributions

    Ben alors soluce de facilité, créer différentes pseudoclasses à largeur déterminée… J’ai l’impression que tu cherches à faire compliqué alors que du simple existe, t’as même le choix entre différentes syntaxes. Si tu veux faire des effets de titre ou de section dans le tooltip, faudra lui donner un contenu « tableau », alors une largeur fixe ça évite les surprises aussi. Si t’es soucieux de l’accessibilité, tu prévois de la marge pour les tailles en em…

    7 avril 2008 à 19 h 27 min #626557
    romk
    Participant
    Padawan WordPress
    60 contributions

    😮 merci, je vais bosser tout ça mais il est vrai qu’il y a une sacrée différence entre FF et IE pour l’interprétation des CSS.

  • Auteur
    Messages
15 sujets de 1 à 15 (sur un total de 15)
  • Vous devez être connecté pour répondre à ce sujet.