Modifier mon CSS

• 

  jcdivet · Membre · Mai 5, 2019 at 11:47

  • Copier le lien
  • Ajouter le thème aux favoris

  Bonjour à tous !!
  Pendant la saison hivernale j’ai mis des flocons de neige sur la page d’accueil de mon site ou plutôt c’est Cécile qui me l’a fait. Je voudrais maintenant supprimer l’effet neige pour mettre si possible des rayons de soleil. Dans mon CSS j’ai ce-ci
  /*
  Bienvenue dans l’éditeur de CSS !

  Pour en savoir plus sur le fonctionnement de l’éditeur, vous pouvez vous
  rendre sur cette page :
  http://wp.me/PEmnE-Bt
  */
  #search {
  display: none;
  }

  #header:before {
  content:  » « ;
  background-image: url(‘https://spotjardin.files.wordpress.com/2018/05/hz7c.jpg’);
  height: 300px;
  width: 100%;
  background-position: center bottom;
  }

  h3.heading {
  font-size: 13px;
  color: #DC143C;
  }

  .single #content {
  position: relative;
  }

  .single .column-content .by-author {
  position: absolute;
  top: 25px;
  font-size: 120%;
  }

  .single .column-content .post-edit-link {
  position: absolute;
  top: 25px;
  left: 160px;
  font-size: 120%;
  }

  de .single .column-content .by-author {
  position: absolute;
  top: 25px;
  font-size: 120%;
  }

  .single .column-content .post-edit-link {
  position: absolute;
  top: 25px;
  left: 160px;
  font-size: 120%;
  }

  de .single .column-content .by-author {
  position: absolute;
  top: 25px;
  font-size: 120%;
  }

  .single .column-content .post-edit-link {
  position: absolute;
  top: 25px;
  left: 160px;
  font-size: 120%;
  }

  .posts .sticky h2, .posts .post h2 {
  font-size: 150%;
  }

  /* start falling snow */
  .fallingSnow {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 500px;
  text-align: center;
  pointer-events: none;
  }

  .fallingSnow span {
  display: inline-block;
  width: 20px;
  height: 21px;
  margin: -280px 60px 54px -34px;
  background: url(‘https://spotjardin.files.wordpress.com/2018/12/snowflake.png’);
  pointer-events: none;
  -webkit-animation: fallingSnow 12s infinite cubic-bezier(0.35,0.45,0.39,0.29);
  -moz-animation: fallingSnow 12s infinite cubic-bezier(0.35,0.45,0.39,0.29);
  }

  .fallingSnow span:nth-child(5n+5) {
  -webkit-animation-delay: 1.3s;
  -moz-animation-delay: 1.3s;
  }

  .fallingSnow span:nth-child(3n+2) {
  -webkit-animation-delay: 1.5s;
  -moz-animation-delay: 1.5s;
  }

  .fallingSnow span:nth-child(2n+5) {
  -webkit-animation-delay: 1.7s;
  -moz-animation-delay: 1.7s;
  }

  .fallingSnow span:nth-child(3n+10) {
  -webkit-animation-delay: 2.7s;
  -moz-animation-delay: 2.7s;
  }

  .fallingSnow span:nth-child(7n+2) {
  -webkit-animation-delay: 3.5s;
  -moz-animation-delay: 3.5s;
  }

  .fallingSnow span:nth-child(4n+5) {
  -webkit-animation-delay: 5.5s;
  -moz-animation-delay: 5.5s;
  }

  .fallingSnow span:nth-child(3n+7) {
  -webkit-animation-delay: 8s;
  -moz-animation-delay: 8s;
  }

  @-webkit-keyframes fallingSnow {
  0% {
  opacity: 1;
  -webkit-transform: translate(0,0px) rotateZ(0deg);
  }

  75% {
  opacity: 1;
  -webkit-transform: translate(100px,600px) rotateZ(270deg);
  }

  100% {
  opacity: 0;
  -webkit-transform: translate(150px,800px) rotateZ(360deg);
  }
  }

  @-moz-keyframes fallingSnow {
  0% {
  opacity: 1;
  -webkit-transform: translate(0,0px) rotateZ(0deg);
  }

  75% {
  opacity: 1;
  -webkit-transform: translate(100px,600px) rotateZ(270deg);
  }

  100% {
  opacity: 0;
  -webkit-transform: translate(150px,800px) rotateZ(360deg);
  }
  }

  /* end falling snow */

  Que dois je supprimer pour n’avoir plus les flocons de neige ? Et quel code dois je mettre à la place pour avoir des rayons de soleil ? Bonne après-midi à tous !!

  L’adresse du blog concerné est (visible uniquement pour les utilisateurs connectés).

• 

  airodyssey · Modérateur · Mai 5, 2019 at 3:38

  • Copier le lien

  Bonjour. Pour éliminer la neige, vous pouvez supprimer tout ce qui se trouve entre…
  /* start falling snow */
  …et…
  /* end falling snow */

  Si vous préférez que le personne le fasse pour vous, dites-le.

  À ma connaissance, WordPress.com n’offre pas de « rayons de soleil » sur ses sites. Je laisse toutefois le personnel confirmer cette information.

• 

  jcdivet · Membre · Mai 5, 2019 at 5:33

  • Copier le lien

  En résumé il s’agit de cette partie. C’est bien ça ? Et si je garde ce code sous le coude je pourrais le recoller l’hiver prochain. C’est bien ça ?

  /* start falling snow */
  .fallingSnow {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 500px;
  text-align: center;
  pointer-events: none;
  }

  .fallingSnow span {
  display: inline-block;
  width: 20px;
  height: 21px;
  margin: -280px 60px 54px -34px;
  background: url(‘https://spotjardin.files.wordpress.com/2018/12/snowflake.png’);
  pointer-events: none;
  -webkit-animation: fallingSnow 12s infinite cubic-bezier(0.35,0.45,0.39,0.29);
  -moz-animation: fallingSnow 12s infinite cubic-bezier(0.35,0.45,0.39,0.29);
  }

  .fallingSnow span:nth-child(5n+5) {
  -webkit-animation-delay: 1.3s;
  -moz-animation-delay: 1.3s;
  }

  .fallingSnow span:nth-child(3n+2) {
  -webkit-animation-delay: 1.5s;
  -moz-animation-delay: 1.5s;
  }

  .fallingSnow span:nth-child(2n+5) {
  -webkit-animation-delay: 1.7s;
  -moz-animation-delay: 1.7s;
  }

  .fallingSnow span:nth-child(3n+10) {
  -webkit-animation-delay: 2.7s;
  -moz-animation-delay: 2.7s;
  }

  .fallingSnow span:nth-child(7n+2) {
  -webkit-animation-delay: 3.5s;
  -moz-animation-delay: 3.5s;
  }

  .fallingSnow span:nth-child(4n+5) {
  -webkit-animation-delay: 5.5s;
  -moz-animation-delay: 5.5s;
  }

  .fallingSnow span:nth-child(3n+7) {
  -webkit-animation-delay: 8s;
  -moz-animation-delay: 8s;
  }

  @-webkit-keyframes fallingSnow {
  0% {
  opacity: 1;
  -webkit-transform: translate(0,0px) rotateZ(0deg);
  }

  75% {
  opacity: 1;
  -webkit-transform: translate(100px,600px) rotateZ(270deg);
  }

  100% {
  opacity: 0;
  -webkit-transform: translate(150px,800px) rotateZ(360deg);
  }
  }

  @-moz-keyframes fallingSnow {
  0% {
  opacity: 1;
  -webkit-transform: translate(0,0px) rotateZ(0deg);
  }

  75% {
  opacity: 1;
  -webkit-transform: translate(100px,600px) rotateZ(270deg);
  }

  100% {
  opacity: 0;
  -webkit-transform: translate(150px,800px) rotateZ(360deg);
  }
  }

  /* end falling snow */

• 

  airodyssey · Modérateur · Mai 5, 2019 at 5:36

  • Copier le lien

  Je vais laisser le personnel prendre la relève pour vos deux autres questions (plus celle sur les « rayons de soleil », comme prévu).

• 

  jcdivet · Membre · Mai 5, 2019 at 6:09

  • Copier le lien

  Entendu. Je leur poserais la question pour savoir quels thèmes ils peuvent me proposer afin de remplacer la neige. Bonne soirée !!

• 

  cecilearkay · Membre · Mai 16, 2019 at 1:01

  • Copier le lien

  Bonjour,

  Pour les rayons de soleil, nous n’avons pas cette option. L’option neige est disponible car c’est un des « easter eggs » historiques de WordPress.

• 

  jcdivet · Membre · Mai 16, 2019 at 3:46

  • Copier le lien

  Bonjour Cécile.
  En dehors de la neige qu’existe t il pour rappeler la bonne saison ?

• 

  cecilearkay · Membre · Mai 16, 2019 at 3:51

  • Copier le lien

  C’est la seule option que nous proposons.

• 

  jcdivet · Membre · Mai 16, 2019 at 3:53

  • Copier le lien

  C’est bien dommage. C’est bien le code que j’ai mis ci-dessus qu’il faut que je supprime ?

• 

  cecilearkay · Membre · Mai 16, 2019 at 4:07

  • Copier le lien

  Oui, c’est correct.

• 

  jcdivet · Membre · Mai 16, 2019 at 5:06

  • Copier le lien

  Et si je mets ce code dans un dossier pour le ressortir l’hiver prochain ça fonctionnera ? Il n’y a pas de manip en particulier à effectuer ?