Forum dei Forum: Aiuto per Forumattivo
Benvenuti sul forum di supporto di Forumattivo.




Per trarre il massimo vantaggio da tutti i servizi offerti dal nostro forum, effettua il login se sei giā un nostro utente oppure registrati per far parte della nostra grande comunitā. Il tutto, gratuitamente!

Crea anche tu un forum gratuitamente come questo! Clicca qui

Sfondo che cambia a seconda dell'orario


Tutorial Sfondo che cambia a seconda dell'orario

Messaggio Da Insane il Gio 09 Gen 2014, 13:38

Sfondo che cambia a seconda dell'ora


Salve con questo tutorial lo sfondo si cambierā a seconda dell'orario ecco un esempio:


Ovviamente potrete cambiare le immagini a vostro piacimento. 
Iniziamo con il tutorial andate in:

PDA  Moduli  Gestione dei codici Javascript  Creare un nuovo script  Tutte le pagine
Codice:
    
$(function () {

   //ZONA EDITABLE------------------------------------------------------------

      var selector_css = "body";
      var imagen_se_repite = true;
      var imagen_fija = false;

      var horario_inicio = new Array();
      horario_inicio["maņana"] = 5;
      horario_inicio["tarde"] = 12;
      horario_inicio["noche"] = 21;

      var imagenes = new Array();
      imagenes["maņana"] = "http://i35.servimg.com/u/f35/17/45/19/77/manana11.jpg";
      imagenes["tarde"] = "http://i35.servimg.com/u/f35/17/45/19/77/tarde11.jpg";
      imagenes["noche"] = "http://i35.servimg.com/u/f35/17/45/19/77/noche11.jpg";
   
   //FIN ZONA EDITABLE----------------------------------------------------------


   var horaActual = (new Date()).getHours();
   var imagen = "";
   if (horaActual >= horario_inicio["maņana"] && horaActual < horario_inicio["tarde"]) {
      imagen = imagenes["maņana"];
   } else if (horaActual >= horario_inicio["tarde"] && horaActual < horario_inicio["noche"]) {
      imagen = imagenes["tarde"];
   } else if (horaActual >= horario_inicio["noche"] || horaActual < horario_inicio["maņana"]) {
      imagen = imagenes["noche"];
   }

   str_css_fixed = "scroll";
   if (imagen_fija) str_css_fixed = "fixed";

   if (imagen_se_repite) {
      $(selector_css).css("background", "url(" + imagen + ") " + str_css_fixed + " repeat");
   } else {
      $(selector_css).css({
         "background-image": "url(" + imagen + ")",
         "background-repeat": "no-repeat",
         "background-size": "cover",
         "background-attachment": str_css_fixed
      });
   }
});

Ora andiamo a modificare il codice:

-selector_css dove applicare l'immagine di sfondo. L'impostazione predefinita č il body

-imagen_se_repite possibili valori veri o falsi . Vero se l'immagine č piccola e si ripete nel assi X e Y False se l'immagine č grande e si vuole riempire l'intera linea, partendo dall'alto.

-horario_inicio["maņana"] Indicare l'ora per il mattino (formato 0-24)
-horario_inicio["tarde"] Indicare l'ora d'inizio per il pomeriggio (formato 0-24)
-horario_inicio["noche"] Indicare l'ora d'inizio per la notte (formato 0-24)

-imagenes["maņana"] URL dell'immagine di sfondo per la mattina
-imagenes["tarde"] URL dell'immagine di sfondo per il pomeriggio
-imagenes["noche"] URL dell'immagine di sfondo per la notte

Ora cliccate salvare ed il gioco č fatto :good:

Tutorial creato da: Turbodeif Tradotto da Insane 
Copyrigth Š FORUMATTIVO.COM



Insane
Veterano dello staff

Sesso : Maschile
Etā : 24
Messaggi : 3848
Localitā : Varese


Vedere il profilo dell'utente http://aiuto.forumattivo.it/
Insane č stato ringraziato dall'autore di questo topic.

Vedere l'argomento precedente Vedere l'argomento seguente Tornare in alto

- Argomenti simili

 
Permesso di questo forum:
Non puoi rispondere agli argomenti in questo forum