Fixer la position d'un gadget sur la page

Fixer un gadget sur son blog consiste à le coller sur un emplacement précis de la page pour ne pas qu'il défile avec le reste des éléments lorsque vos visiteurs utilisent les ascenseurs (scrollbars) de leur navigateur.

Ceci est très utile lorsque vous souhaitez qu'un information importante soit constamment affichée à l'écran, ou qu'une fonction ou un lien soit constamment disponible, sans avoir à faire des aller-retours verticaux : lien de contact, abonnement au flux RSS, status twitter... les applications sont nombreuses selon vos besoins.

Nous allons prendre l'exemple d'un lien simple d'abonnement au flux RSS.Le principe est le même quelque soit l'utilisation que vous choisirez.

D'abord crée un gadget de type HTML/Javascript, de titre vide. Ajoutez le de préférence dans le pied de page de votre blog.

Dans le contenu, collez-le code ci-dessous :
Abonnez-vous au flux RSS
La première et la dernière ligne définisse simplement le bloc qu'on va positionner. Le contenu, ici le lien, est celui de votre choix.

Maintenant, il s'agit de positionner ce gadget de manière un peu particulière.

Dans le code de votre modèle, localisez la ligne
]]>
Juste avant, recopiez le code suivant :
#bloc-fixe {
position:fixed;
bottom:0px;
right:10px;
}
Enregistrez, c'est terminé. Voilà maintenant le contenu du gadget qui reste collé en bas de page.

A vous de le positionner au mieux dans votre mise en page : en jouant sur les attributs top, bottom, right, left.

Exemple pour un élément collé en haut à droite de la page :
top:0px;
left:0px;
L'effet fonctionne avec Internet Explorer 8 et Firefox 3.5.







Suivez Nous


Subscribe by: RSS Email
Follow me on: Twitter Google Plus

Recevez mes articles par e-mail

Recevez mes articles directement dans votre boite e-mail. Profitez de dossiers exclusivement envoyés aux abonnés de la newsletter

devenir Membres

Articles récents