WebSite X5Help Center

 
Pasqualino D.
Pasqualino D.
User

Javascript  it

Auteur : Pasqualino D.
Visité 1864, Followers 1, Partagé 0  

Ho questo codice javascript "che funziona" ma vorrei che al posto della scritta, potessi fare in modo che un'immagine sparisse alla fine del conteggio, qualcuno sà come fare? Grazie in anticipo.

<script type="text/javascript">
/*countdown - conto alla rovescia*/
function countdown()
{
var_anno=2014;
var_mese=10;
var_giorno=26;
var_ore=21;
var_minuti=0;
var_secondi=0;
data_scandeza= new Date(var_anno,var_mese-1,var_giorno,var_ore,var_minuti,var_secondi);
data_oggi= new Date();
differenza=(data_scandeza-data_oggi);
giorni=parseInt(differenza/86400000);
differenza=differenza-(giorni*86400000);
ore=parseInt(differenza/3600000);
differenza=differenza-(ore*3600000);
minuti=parseInt(differenza/60000);
differenza=differenza-(minuti*60000);
secondi=parseInt(differenza/1000);
differenza=differenza-(secondi*1000);
if (giorni <= "0" && ore <= "0" && minuti <= "0" && secondi <= "0")
{
document.getElementById("countdown")[removed]="OPS, Tempo scaduto";
}
else
{
document.getElementById("countdown")[removed]=giorni +' giorni '+ore+' ore '+minuti+' min '+secondi+' sec';
setTimeout("countdown()",1000)

}
}
</script>

<body onload="countdown()"><div id="countdown"></div>

Posté le
23 RéPONSES - 1 CORRECT
Pasqualino D.
Pasqualino D.
User
Auteur

Scusate... Questo è il codice completo

<script type="text/javascript">
/*countdown - conto alla rovescia*/
function countdown()
{
var_anno=2014;
var_mese=10;
var_giorno=26;
var_ore=21;
var_minuti=0;
var_secondi=0;
data_scandeza= new Date(var_anno,var_mese-1,var_giorno,var_ore,var_minuti,var_secondi);
data_oggi= new Date();
differenza=(data_scandeza-data_oggi);
giorni=parseInt(differenza/86400000);
differenza=differenza-(giorni*86400000);
ore=parseInt(differenza/3600000);
differenza=differenza-(ore*3600000);
minuti=parseInt(differenza/60000);
differenza=differenza-(minuti*60000);
secondi=parseInt(differenza/1000);
differenza=differenza-(secondi*1000);
if (giorni <= "0" && ore <= "0" && minuti <= "0" && secondi <= "0")
{
document.getElementById("countdown")[removed]="OPS, Tempo scaduto";
}
else
{
document.getElementById("countdown")[removed]=giorni +' giorni '+ore+' ore '+minuti+' min '+secondi+' sec';
setTimeout("countdown()",1000)

}
}
</script>

<body onload="countdown()"><div id="countdown"></div>

</script>
</head>
<body onLoad="Countdown()">
<div id="testo"></div>
</body>
</html>

Lire plus
Posté le de Pasqualino D.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

1) - come prima istruzione metti la stringa in grassetto:
<script type="text/javascript">
function chiudi() { document.getElementById('pippo').style.display = "none"; } 
/*countdown - conto alla rovescia*/
...ECCETERA...

2) - dopo il messaggio del tempo scaduto metti la stringa in grassetto:
OPS, Tempo scaduto";
chiudi();
...
...
... l'immagine nel BODY la carichi così:
<img id="pippo" src="percorso/tuaimmagine.jpg" />

...
.


ciao

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Pasqualino D.
Pasqualino D.
User
Auteur

Ok funziona, soltanto che all'avvio della pagina con il tempo scaduto per un secondo vedo l'immagine poi sparisce

Lire plus
Posté le de Pasqualino D.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... io non ho il programma, ...ma in teoria non dovrebbe avvenire questo flash dell'immagine...

... lo SCRIPT lo hai inserito in HEAD, ...o dove...?...

... hai un LINK per provare...?...

.

ciao

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... no! ... hai fatto degli errori; ...per evidenziarli copia la stringa a seguire, tutto il rigo per intero, e la incolli nella barra indirizzi di FireFox, e li vedrai in rosso:

view-source:http://dtstudio.altervista.org/

...

... rimedio:

.1 ... il codice SCRIPT del COUNTDOWN lo devi inserire nel Pannello Esperto |  HEAD/HEAD

.2 ... il codice dell'immagine lo devi inserire in un Oggetto HTML dell'Intestazione (pergamena), se è lì che la vuoi;

.3 ... il codice ONLOAD (e solo: onload="countdown()") lo devi inserire nel Pannello Esperto | Proprietà del tag BODY (ovvero all'interno dell'istruzione <BODY>), quindi non nell'opzione: Dopo l'apertura del tag BODY, Prima della chiusura del tag BODY (!NO!)

... considera sempre che io sono senza programmi, ...ma quando avrai sistemato, fallo sapere, in modo da andare a  controllare se la persistenza flash dell'immagine si verifichi ancora...

.

ciao

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Pasqualino D.
Pasqualino D.
User
Auteur

Ciao mirko.. si avevo gia provato in quel modo, ma ogni volta che ricarichi la pagina si riapre l'mmagine, io ho bisogno che oltre una certa data non appaia più

Lire plus
Posté le de Pasqualino D.
Pasqualino D.
Pasqualino D.
User
Auteur
 ‪ KolAsim ‪ ‪
... no! ... hai fatto degli errori; ...per evidenziarli copia la stringa a seguire, tutto il rigo per intero, e la incolli nella barra indirizzi di FireFox, e li vedrai in rosso: view-source:http://dtstudio.altervista.org/ ... ... rimedio: .1 ... il codice SCRIPT del COUNTDOWN lo devi inserire nel Pannello Esperto |  HEAD/HEAD .2 ... il codice dell'immagine lo devi inserire in un Oggetto HTML dell'Intestazione (pergamena), se è lì che la vuoi; .3 ... il codice ONLOAD (e solo: onload="countdown()") lo devi inserire nel Pannello Esperto | Proprietà del tag BODY (ovvero all'interno dell'istruzione <BODY>), quindi non nell'opzione: Dopo l'apertura del tag BODY, Prima della chiusura del tag BODY (!NO!) ... considera sempre che io sono senza programmi, ...ma quando avrai sistemato, fallo sapere, in modo da andare a  controllare se la persistenza flash dell'immagine si verifichi ancora... . ciao

forse ho sbagliato qualcosa?

http://dtstudio.altervista.org/

Lire plus
Posté le de Pasqualino D.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
P. Della Torre
 ‪ ... ... ...  ... ... ... forse ho sbagliato qualcosa?http://dtstudio.altervista.org/

... sì ... errato ...

... rispetta quello che ti avevo indicato; ...casomai spiegami cosa non ti è chiaro...

.. lo riassumo:

1 - lo SCRIPT deve andare nella sezione HEAD;

2 - ONLOAD nella dichiarazione del BODY e non nel corpo del BODY

3 - il DIV del testo, se lo vuoi vedere deve andare in un oggetto HTML qualsiasi posizionato dove vuoi nelle sezioni della pagina;

4 - il codice IMMAGINE deve andare in Oggetto HTML dell'Intestazione, o il atro Oggetto Codice HTML della Pagina;

... nella pagina deve esistere solo una coppia di HEAD/HEAD, BODY/BODY, HTML/HTML...

... questa  la struttura:

<html><head>...</head><body (...)> ... </body></html>

... attualmente è tutto un po' scombinato per codici esterni inseriti da te...

... controlla con FireFox come detto prima...

... prova; si tratta di individuare nel programma le sezioni corrette, e non è difficile...

... non ti preoccupare a chiedere, magari nello specifico dell'azione che fai...

.

ciao

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Pasqualino D.
Pasqualino D.
User
Auteur

Allora riepiloghiamo:

1) Prima della chiusura del tag HEAD

function countdown()
{

var_anno=2014;
var_mese=10;
var_giorno=26;
var_ore=14;
var_minuti=54;
var_secondi=0;
data_scandeza= new Date(var_anno,var_mese-1,var_giorno,var_ore,var_minuti,var_secondi);
data_oggi= new Date();
differenza=(data_scandeza-data_oggi);
giorni=parseInt(differenza/86400000);
differenza=differenza-(giorni*86400000);
ore=parseInt(differenza/3600000);
differenza=differenza-(ore*3600000);
minuti=parseInt(differenza/60000);
differenza=differenza-(minuti*60000);
secondi=parseInt(differenza/1000);
differenza=differenza-(secondi*1000);
if (giorni <= "0" && ore <= "0" && minuti <= "0" && secondi <= "0")
chiudi();
else
{
setTimeout("countdown()",1000)
}
}
</script>

2) Proprietà deltag BODY

Lire plus
Posté le de Pasqualino D.
Pasqualino D.
Pasqualino D.
User
Auteur

In pratica :

1) Prima della chiusura del tag HEAD

function countdown()

2) Nella proprietà del tag BODY

Lire plus
Posté le de Pasqualino D.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... OK ... bravo ... ce l'hai fatta ...!... QUASI ...!... 

... adesso devi riparare gli ultimi errori...

1) ... devi inserire <script> prima della funzione function countdown(), così:

<script> function countdown()  ...eccetera...eccetera

2) ... devi racchiudere la funzione chiudi() tra le graffe "{ }", così:

{ chiudi(); }

...

... fatto; ... ... e vai ... ... .. .. . .

.... 

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Pasqualino D.
Pasqualino D.
User
Auteur

Scusa ma la "Function chiudi()" dov'è?

Lire plus
Posté le de Pasqualino D.
Pasqualino D.
Pasqualino D.
User
Auteur

dove la metto sopra la function countdown()

Lire plus
Posté le de Pasqualino D.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
P. Della Torre
Scusa ma la "Function chiudi()" dov'è?

... non avevo notato che nell'ultimo codice l'avevi dimenticata, per come ti avevo detto al 1° Post in alto; ...quindi devi cominciare così:

<script>
function chiudi() { document.getElementById('pippo').style.display = "none"; } /*countdown - conto alla rovescia*/
function countdown() {
ECCETERA

.

... questo: chiudi(); } ...vedo che l'hai messo a posto...

.

... vai con l'ultimo sforzo...

.

ciao

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Pasqualino D.
Pasqualino D.
User
Auteur

Ok ma l'immagine si vede nonostante il tempo sia scaduto..

Lire plus
Posté le de Pasqualino D.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... non: onload="Countdown()"

...  ma: onload="countdown()"

.

ciao

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Pasqualino D.
Pasqualino D.
User
Auteur

Ok ma siamo al punto di partenza.. l'immagine si vede per un secondo poi sparisce. Io penso che prima di far vedere l'immagine dovrebbe eseguire la funzione altrimenti l'immagine si vede a ausa del "setTimeout("countdown()",1000)" e poi sparisce.

Lire plus
Posté le de Pasqualino D.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... per verificare ho dovuto fare una prova con il blocco note, ed ho notato che con una immagine leggera è tutto regolare, invece con una immagina più pesante effettivamente appare l'immagine per un flash...
... esempio originale di base con solo la mia funzione chiudi():  
http://www.zspace.it/kolasim/countdownWPK/countdown-img1.html
... esempio rivisto aggiungendo lo style display none:  
http://www.zspace.it/kolasim/countdownWPK/countdown-img2.html
...
... quindi, inserire in HEAD:
<style> #pippo { display:none; } </style>

... e come ultima istruzione dello SCRIPT la stringa dopo setTimeout:
setTimeout("countdown()",1000);
document.getElementById('pippo').style.display = "block";
...
... puoi vedere il codice direttamente nel sorgente HTML della pagina...
...
.... e così dovresti essere a posto...
.


ciao


===EDIT=====

... per provare i mio countdown setta provvisoriamente l'orologio del PC alle ore 10 e minuti 20 (di oggi)

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Pasqualino D.
Pasqualino D.
User
Auteur

Funziona! Grazie di tutto

Lire plus
Posté le de Pasqualino D.