recherche cadre sur l'acceuil

[mlle]

bonjour,
je cherche à faire cette effet un cadre qui flotterais sur la page d'acceuil, mais je ne sais pas comment faire :/
est-ce que quelqu'un saurait ?

[Invité]

Salut mlle,

tout se passera par le template pour le contenu, ensuite on donnera un style  pour le rendu   .

Dans le template overall_header:
Affichage/Templates/Général/ overall_header

Recherche ceci:

Code:

<table cellspacing="0" cellpadding="0" border="0" align="{MENU_POSITION}">
 <tr>
 <td align="{MENU_POSITION}"{MENU_NOWRAP}>{GENERATED_NAV_BAR}</td>
 </tr>
 </table>

Juste après colles ceci:

Code:


<div id="M14_bloc_flottant">
  
  <div class="M14_contenant">
    <span class="M14_titre">Contenu texte 1</span><br />
    <span class="M14_titre">Contenu texte 2</span><br />
    <span class="M14_titre">Contenu texte 3</span><br />
    <span><a href="LIEN 1" target="_blank">Contenu lien 1</a></span><br />
    <span><a href="LIEN 2" target="_blank">Contenu lien 2</a></span><br />
  </div>
                            
</div>


J'ai créé trois contenus en texte et deux avec un lien en cas ou ....


Remplaces le texte par ce que tu souhaites ainsi que les liens   .

Pensez a enregistrer les modifications en cliquant respectivement sur et


Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Colles ceci:

Code:


/*LE BLOC*/
#M14_bloc_flottant
{
position:fixed;/*on fixe le menu*/
top:10%;/*on le positionne a 10 pourcent du haut*/
left:5%; /*on le positionne a 5 pourcent de la gauche*/
border:1px dashed black;/*le style des bordures*/
background:transparent;/* on demande un fond transparent*/
width:auto;/*on demande une largeur automatique*/
height:auto;/*on demande une hauteur automatique*/
}
/*LE BLOC CONTENANT LES TEXTES ET LES LIENS*/
.M14_contenant
{
background:white;/* on demande une couleur de fond*/
margin:10px 20px 10px 20px; /*on demande des marges 10px haut 20 px droite 10px bas 20px gauche*/
padding:20px 30px 20px 30px;  /*on demande un espace de 20px haut 30px droite 20px bas 30px gauche*/
-webkit-border-radius: 30px;/*les bordures arrondies*/
-moz-border-radius: 30px;
border-radius: 30px;
}
/*LES CONTENANTS TEXTE*/
.M14_contenant span.M14_titre
{
color:black;/*couleur de police*/
font-size:11px;/*taille de police*/
-webkit-transition: color 0.5s ease-in-out;/*les transitions*/
-moz-transition:color 0.5s ease-in-out;
-o-transition: color 0.5s ease-in-out;
transition: color 0.5s ease-in-out;
}
/*LES CONTENANTS TEXTE AU SURVOL*/
.M14_contenant span.M14_titre:hover
{
color:blue;/*couleur de police*/
}
/*LES CONTENANTS LIENS*/
.M14_contenant span a
{
color:red;/*couleur de police*/
font-size:11px;/*taille de police*/
text-decoration:none !important;/*on supprime le soulignement*/
-webkit-transition: color 0.5s ease-in-out;/*les transitions*/
-moz-transition:color 0.5s ease-in-out;
-o-transition: color 0.5s ease-in-out;
transition: color 0.5s ease-in-out;
}
/*LES CONTENANTS LIENS AU SURVOL*/
.M14_contenant span a:hover
{
color:pink;/*couleur de police*/
}



Penses à cliquer sur le bouton

Amuses toi bien   .

a++

[mlle]

merci beaucoup, ça marche **