Ouvrir une demande d'aide
Connexion

Récupérer mon mot de passe

Derniers sujets
» Sur les moteurs de recherche
Mar 30 Aoû 2016, 14:03 par Alicia Hopeful

» Date d’un article sur un blog
Lun 27 Juin 2016, 19:50 par Gérard du 07

» achat de crédits défectueux
Mer 11 Mai 2016, 12:33 par Nicoape

» Intégration d'un sondage sur le blog
Mer 27 Avr 2016, 20:40 par Nicoape

» Articles apparaissant dans la partie module
Mer 27 Avr 2016, 11:06 par Nicoape

» (#2105): Problème d'affichage des commentaires
Sam 16 Avr 2016, 19:34 par Singleton

» Présentation des membres
Sam 16 Avr 2016, 18:40 par Zeno

» inserer un tableau dans un article
Dim 27 Mar 2016, 20:28 par Nicoape

» Répertoriage de mon blog sur les moteurs de recherche
Lun 14 Mar 2016, 16:01 par Nicoape

» Redirection Adf.ly
Ven 04 Mar 2016, 21:55 par mespetitstresors

Les posteurs les plus actifs du mois
Moustache
 
Caryle chaverot
 
kikikapitaine
 
Zeno
 
Singleton
 

Qui est en ligne ?
Il y a en tout 2 utilisateurs en ligne :: 0 Enregistré, 0 Invisible et 2 Invités

Aucun

[ Voir toute la liste ]


Le record du nombre d'utilisateurs en ligne est de 183 le Mar 16 Juil 2013, 12:37

Créer un module caché qui s'affiche au passage de la souris

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

Astuce Créer un module caché qui s'affiche au passage de la souris

Message par Singleton le Sam 14 Juil 2012, 18:47

Créer un module caché qui s'affiche au passage de la souris


En suivant ce tutoriel vous serez capable de créer un module caché qui défilera en passant la souris.


Le code CSS

Ajoutez le code suivant dans votre feuille de style ( Administration ›› MultiBlog ›› Thème personnalisé ›› Edition experte )

Code:
.onglet {max-width: 190px ;
height: auto;
position: MODIF;
top: 190px;
left: -150px;
background: MODIF;
border-radius: 0 10px 10px 0;
        -moz-border-radius: 0 10px 10px 0;
        -webkit-border-radius: 0 10px 10px 0;
        padding: 7px;
box-shadow: 3px 3px 4px #666;
-htm-transition-duration:1s;
  -moz-transition-duration:1s;
  -o-transition-duration:1s;
  -webkit-transition-duration:1s;
overflow: scroll;
padding-left: 10px
}

.onglet:hover { left: 0px!important;}


Ce que vous devez modifier:

  • position: MODIF; Vous devez remplacer MODIF par fixed pour que le contenu ne défile pas avec la page soit par absolute pour qu'il défile avec celle ci.

  • background: MODIF; A remplacer par la couleur de votre choix

  • border-radius: 0 10px 10px 0;
    -moz-border-radius: 0 10px 10px 0;
    -webkit-border-radius: 0 10px 10px 0;
    Remplacez les nombres 10 par le degré de l'arrondi de la cellule ou laissez tel quel.



Le code HTML

Le code HTML est à placer dans le contenu personnalisable ( Administration ›› Multiblog ›› Général ››
Contenu personnalisable ) qui est à paramétrer ainsi:

Règle d'affichage: Celle de votre choix
Position verticale: En dessous du nom du blog ( si vous avez déjà quelque chose dans le contenu personnalisable laissez comme tel )


Et collez ce code à l'intérieur:

Code:
<div class="onglet">Mettez ce que vous voulez ici</div>

N'oubliez pas d'enregistrer ;)

Ce tutoriel a été rédigé par le Staff du Forum des Blogs,
Et en particulier par Wave.

Aucune reproduction possible sans notre accord, conformément à l’article L122-1 du CPI.


Cordialement,



Singleton
Adminblog
Adminblog

Masculin
Messages : 1508

http://forum.forumactif.com/u134151

Revenir en haut Aller en bas

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum