Help domanda brevissima sull'header

**Tonenge** · 18-11-2014, 00:30

Ciao Lorenzo,
sperando di aver interpretato correttamente la tua domanda, ho scritto una "brevissima" funzione:

codice:

<!DOCTYPE>
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>Fade Header</title>
<script>

T=3;                   // secondi durata dissolvenza

window.onload=Fade;

function Fade(o,i){
  if(!i) i=0; i++; i&=3;   
  o=o?0:1;     
  
  tx=["Header frase 1", "Secondo Testo 2"];            // Frasi che si alternano
  
  var j=document.getElementById("id_header");
  j.innerHTML=tx[parseInt(i/2)];
  j.style.opacity=o;
  j.style.transition="opacity "+T+"s";
  
setTimeout("Fade("+o+","+i+")",1000*T);
}


</script>  
  </head>
  <body>

<div id="id_header" style='font:bold 32px Arial;'></div>

  </body>
</html>

**riccardomancini** · 20-11-2014, 22:37

Originariamente inviata da Tonenge

Ciao Lorenzo,
sperando di aver interpretato correttamente la tua domanda, ho scritto una "brevissima" funzione:

codice:

<!DOCTYPE>
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>Fade Header</title>
<script>

T=3;                   // secondi durata dissolvenza

window.onload=Fade;

function Fade(o,i){
  if(!i) i=0; i++; i&=3;   
  o=o?0:1;     
  
  tx=["Header frase 1", "Secondo Testo 2"];            // Frasi che si alternano
  
  var j=document.getElementById("id_header");
  j.innerHTML=tx[parseInt(i/2)];
  j.style.opacity=o;
  j.style.transition="opacity "+T+"s";
  
setTimeout("Fade("+o+","+i+")",1000*T);
}


</script>  
  </head>
  <body>

<div id="id_header" style='font:bold 32px Arial;'></div>

  </body>
</html>

Ed' invece per aggiungere più di 2 frasi che si alterneranno? Io ho provato ad'aggiungere più frasi all'interno del tx e cambiare il parseInt(i/2) in parseInt(i) ma il risultato non è fluido come con i primi due, come posso fare?

**LorenzoGiannoni** · 21-11-2014, 00:09

Originariamente inviata da riccardomancini

Ed' invece per aggiungere più di 2 frasi che si alterneranno? Io ho provato ad'aggiungere più frasi all'interno del tx e cambiare il parseInt(i/2) in parseInt(i) ma il risultato non è fluido come con i primi due, come posso fare?

Studi e te lo fai

**Tonenge** · 21-11-2014, 10:40

Ciao riccardomancini,
benvenuto nel forum,
ho modificato lo script in modo che puoi aggiungere e togliere frasi nella variabile "tx".

Saluti

codice:

<!DOCTYPE>
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>Fade Header</title>
<script>



T=3;                               // secondi durata dissolvenza
tx=["Header frase 1",             // Frasi che si alternano
    "Secondo Testo 2", 
    "Testo 3", 
    "frase 4",
    "frase 5"
];             

window.onload=Fade;
 
 
function Fade(o,i){
  o=+!o; i=i||0; i++; if(i>=(tx.length*2)) i=0;  
  var j=document.getElementById("id_header");
  j.innerHTML=tx[i>>1];
  with(j.style) opacity=o, transition="opacity "+T+"s"; 
setTimeout(function(){ Fade(o,i); },1000*T);
}


</script>  
  </head>
  <body>

<div id="id_header" style='font:bold 32px Arial;'></div>

  </body>
</html>

Discussione: Help domanda brevissima sull'header

Strumenti discussione

Ricerca discussione

Visualizza

Hybrid View

Permessi di invio