Ouvrir une demande d'aide
Derniers sujets
» Blog Post missing
Mar 27 Fév 2018, 14:43 par Singleton

» impossible d'ouvrir les liens
Mer 31 Jan 2018, 23:58 par /dm61

» synchroniser forum et blog
Mar 30 Jan 2018, 03:22 par /dm61

» Statistiques
Lun 01 Jan 2018, 21:08 par Kiyomizu

» Centres d'intérêts
Dim 31 Déc 2017, 12:44 par Passiflore

» Les livres, une grande histoire d'amour ♥
Dim 31 Déc 2017, 12:42 par Passiflore

» Les motivations qui vous ont poussé à créer un blog ?
Dim 31 Déc 2017, 12:36 par Passiflore

» Présentation des membres
Lun 10 Avr 2017, 15:10 par Singleton

» Bonnes fêtes de fin d'année !
Jeu 05 Jan 2017, 03:22 par Derri

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

Les posteurs les plus actifs du mois

Qui est en ligne ?
Il y a en tout 13 utilisateurs en ligne :: 0 Enregistré, 0 Invisible et 13 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

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,


avatar
Singleton
Adminblog
Adminblog

Masculin
Messages : 1547

http://forum.forumactif.com/u134151

Revenir en haut Aller en bas

Revenir en haut

- Sujets similaires

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