le MEMO du WEB développeur
 

••• Astuces de programmation •••   Liste des Mémos, astuces et bonnes pratiques

Garder une variable de session après fermeture du navigateur - PHP
Créer un bouton imprimer sur sa page web - Javascript
Empêcher de coller du texte dans un champs input de type text - JQuery
Retrouver les coordonnées latitude longitude d'un endroit avec Google Map - Divers
Ajouter un masque de saisie dans un champs input text - JQuery
Une image de background aléatoire - CSS
Empêcher l'autocomplétion dans les formulaires - HTML
Une liste d'articles au hasard dans Wordpress - Wordpress
DatePicker de JQuery : Déployer le calendrier à l'ouverture de la page - JQuery
Apparition d'un élément en fondu avec JQuery sur le survol de souris - JQuery
Détecter un click à l'extérieur d'un élément avec JQuery - JQuery

Afficher une image différente selon la date de l'année en javascript - JQuery

Ce script javascript permet d'afficher une image de background différente selon les saisons à l'élément d'identifiant id="monimage"

L'idée est d'analyser la date courante afin de déterminer la saison en utilisant l'objet new Date(année, mois, jour)

<script>
  $(function() {
    var today = new Date();
    var ladate=Date.parse(today);
    var lannee = today.getFullYear();
    var dateprintemps  =Date.parse(new Date(lannee, 2, 21));
    var dateete        =Date.parse(new Date(lannee, 5, 21));
    var dateautomne    =Date.parse(new Date(lannee, 8, 21));
    var datehiver      =Date.parse(new Date(lannee, 11, 21));
    if(ladate>=dateprintemps && ladate<dateete){
      $("#monimage").css({backgroundImage: "url('img/Fond-Printemps.png')"}); }
    else if(ladate>=dateete && ladate<dateautomne){
      $("#monimage").css({backgroundImage: "url('img/Fond-Ete.png')"});  }
    else if(ladate>=dateautomne && ladate<datehiver){
      $("#monimage").css({backgroundImage: "url('img/Fond-Automne.png')"});  }
    else if(ladate>=datehiver || ladate<dateprintemps){
      $("#monimage").css({backgroundImage: "url('img/Fond-Hiver.png')"});  }
});
</script>

 

publié le 08/08/2012 par Memo Web
AstuceDatesImages
Commentaire :
Bonsoir,merci pour le script
Est-ce que c'est possible d'afficher une liste d'éléments par rapport à la date d'affichage (pour gérer les rendez-vous):je veux afficher la liste des clients attendus chaque jour
Merci
par inconnu, le 18/04/2013
Commenter le Mémo :

Atteindre une ancre avec JQuery - JQuery
Détecter lorsqu'on appuie sur la touche entrée en JQuery - JQuery
Comment ne pas interpréter une commande HTML à l'affichage - HTML
Padding et margin en hauteur ne fonctionnement pas sur éléments inline - HTML
Revenir à la page précédente du navigateur - HTML
Trouver le chemin canonique absolu d'un répertoire - HTML
Faire appel à un fichier CSS à l'intérieur d'un autre fichier CSS - CSS
Faire clignoter un élément avec JQuery - JQuery
Ajoutez vos propres Mémos sur MEMO-WEB

Il suffit de vous créer un compte sur le site

Vous pourrez choisir un thème parmis l'une des catégories proposées par MEMO-WEB.

Rédigez votre Mémo.
Après validation par MEMO-WEB, il sera mis en ligne.
Ajouter vos Mémos