Nippon Sekai : le nouveau monde

Une catastrophe : la fin d'un monde et la naissance d'un nouveau. Découvrez l'aspect de cette nouvelle Terre où la féérie a prit une place importante...
 
AccueilAccueil  CalendrierCalendrier  FAQFAQ  RechercherRechercher  MembresMembres  GroupesGroupes  S'enregistrerS'enregistrer  ConnexionConnexion  
Bienvenue à vous, chers invités du sol Nippon

Partagez | 
 

 Infos Bulles

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage

○ Fondateur ○

○ Fondateur ○
avatar


Messages : 352
Localisation : Quelque part
Humeur : Massacrante

MessageSujet: Infos Bulles   Ven 23 Avr - 11:55

Voilà comment faire des infos bulles comme ça :



SHIN MINAMOTO




Tout d'abord, vous devez dans votre feuille de style CSS mettre ce code qui suit :


Code:
 .bubulle:hover{
    background-color: transparent;
    z-index: 50;
    }

    .bubulle span img{ /*CSS image élargie*/
    border-width: 0px;
    padding: 2px;
    }

    .bubulle:hover span{ /*CSS image élargie sur hover*/
    visibility: visible;
    width: 150px; /*à modifier : indique la largeur de ton infobulle*/

    }

    .bubullespan { /*CSS pour image élargie*/
    position: absolute;
    background-color: #161e26; /*à modifier : couleur de fond de ton infobulle*/
    border: 2px solid #1D2730; /*à modifier : taille, forme et couleur de la bordure*/
    color: #ffffff !important;
    visibility: hidden;
    text-decoration: none;
    padding:10px;
    }


Puis, dans vos messages, ou sur votre page d'accueil, rentrez le code suivant en remplissant avec les bonnes informations ( la première adresse de la première image correspond à la plus grande )


Code:
<center><a href="#" class="bubulle"><img src="URL DE L'IMAGE">
<span><img src="URL DE L'IMAGE" border="0" alt="" /><br>NOM DU PERSONNAGE<div><a href="URL DE RENVOI">NOM DU RENVOI</a></div><div><a href="URL DE RENVOI">NOM DU RENVOI</a></div></span></a></center>

Sachez que le terme " bubulle " qui se trouve dans votre code CSS peut-être changé comme vous le souhaitez : si vous voulez mettre " pipi " ou " caca ", c'est comme vous voulez, du moment que dans le code html pour le forum les termes contenus dans dans votre css soient identiques

▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬
L⓿ve me Dead...
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://nippon-sekai.forumactif.com
 

Infos Bulles

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Nippon Sekai : le nouveau monde :: Espace détente :: ::: Graphisme ::: :: Aides-