Comme vous le pouvez voir, il neige sur mon Over-blog de niveau Confiance.

Comment cela est-il possible ?

 

Tour d'abord, il vous faut savoir si le css du thème de base Over-Blog que vous avez choisi est modifiable. C'est indiqué dans >Design >Thèmes prédéfini en prévisualisant le thème.
Il vous faut également savoir si votre fond de blog est une coleur ou une image.

 

Bien sûr, il vous faut une image de neige qui tombe.

J'en donnerais quelques exemples en fin d'article.

 


Si votre thème possède un css déjà modifié Si votre thème possède un css non modifiable ou jamais modifié
Si votre fond de blog est une couleur

C'est la solution la plus simple.
Repérez la dernière ligne body de votre css et ajoutez-y entre l'accolade ouvrante et l'accolade fermantel'information de l'image "neige qui tombe" :  
background-image:url(URL DE L IMAGE DE NEIGE); background-repeat:repeat; background-position:center; background-attachment:fixed;


Validez votre css et videz le cache pour voir immédiatement le résultat.

 

Pour revenir à la configuration précédente, il faudra effacer cette même instruction de la ligne body.

Dans ce cas là le mieux est de vous inspirer de cet article de mon blog afin d'ajouter le code suivant dans le code de votre en-tête :
<style type="text/css"><!--
body { background-image:url("URL DE L IMAGE DE NEIGE"); background-repeat:repeat; background-position:center; background-attachment:fixed; }
--></style>

 

Pour revenir à la configuration précédente, il faudra effacer cette même instruction du module.

Si votre fond de blog est une image

C'est la solution la plus compliquée car elle implique deux changements : 

déplacer votre image de fond de blog
ajouter l'image de neige qui tombe

 

Je vais parler ici de la première partie puisque la seconde est absolument identique à celles utilisées ci-dessus que je reprendrais sommairement.

 

Le secret est de déplacer l'image de fond dans une ligne intitulée html de façon à libérer la place de l'image dans la ligne body.
Pourquoi pas l'inverse qui serait plus simple ?
Parce que le body se trouve devant le html et donc la neige sera devant le fond de blog.

Créons une partie réservée en toute fin de votre css :

/*--------NEIGE--------*/
html {background-image:url(URL DE L IMAGE DE FOND)}
body { background-image:url("URL DE L IMAGE DE NEIGE"); background-repeat:repeat; background-position:center; background-attachment:fixed; }

ajoutons ce code dans le code html de votre en-tête :

<style type="text/css"><!--
html {background-image:url(URL DE L IMAGE DE FOND)}
body { background-image:url("URL DE L IMAGE DE NEIGE"); background-repeat:repeat; background-position:center; background-attachment:fixed; }
--></style>

Pour revenir à la configuration sans neige, il suffit d'effacer ces lignes.

 

Maintenant que la technique est comprise, voici quelque sexemple de gifs animés de neige tombante.

Bien entendu, les images à fond transparent sont à privilègier si vous avez une image en fond de blog...

Pour les utiliser, le mieux est de les récupérer et de les héberger vous même : clic-droit "enregistrer l'image sous" permet de récupérer l'image que vous hébergerez dans un dossier de votre administration Over-Blog.

neige01
  neige02
  neige03
  neige04
  neige05
  neige06
  neige07
  neige11
  neige12

 

Vous en trouverez d'autres lors de recherches dans un moteur de recherches comme Google, yahoo ou Bing! par exemples.

Publié dans : CSS - Demander une aide - Voir les 0 commentaires
Retour à l'accueil

Communication

Plusieurs moyens pour obtenir un coup de main de ma part :
Ajoutez un commentaire dans l'article qui vous intéresse.

Powered By Hab.la

overblog

Présentation

Derniers Commentaires

Références

Texte Libre

policevert

 
Créer un blog gratuit sur over-blog.com - Contact - C.G.U. - Rémunération en droits d'auteur - Signaler un abus - Articles les plus commentés