Inserimento countdown in cella di un oggetto tabella
Autore: Duccio M.
Visite 2306,
Followers 1,
Condiviso 0
Buongiorno a Tutti,
chiedo supporto al forum per la fattibilità dell'operazione che non riesco a fare.
Nel sito http://www.pattinaggioartisticosiena1871.it, nella home page, box CALENDARIO EVENTI 2018, colonna DATA EVENTO, al di sotto della data vorrei inserire, in ciascuna cella, un countdown all'evento.
Ho provato ad inserire codici HTML ma la colonna si allarga in maniera spropositata. Invece vorrei che rimanesse della dimensione attuale.
Mi sapreste aiutare ?
Grazie
Postato il
io avrei usato un'altro metodo, visto che la tabella non è responsive, e quindi da Mobile viene tagliata...piuttosto fai con oggetto testo, e a fianco di ogni oggetto gli puoi mettere il countdown...
... purtroppo io non posso provare, ma ne sei sicuro...?...
... hai provato ad inserire il codice HTML sviluppato in unica riga di codice...?...
... per esempio, prova ad inserire nella prima cella della prima colonna della tabella, al posto della data attuale, questo codice:
02/06/2018 <br><div id="num1" style="width:140px;font-size:10pt;background-color:yellow" ><img style="float:left" src="http://www.kolasim-zone.it/immagini/occhiorosso.png" onload="controllodataK()" /> scade tra XX giorni</div> <script>function controllodataK(){alert("controllo funzioneK: attiva!");}</script>
... tutto così, senza ritorni a capo; ... eventualmente incolla nel blocco note e controlla...
... quando avrai fatto ed esportato fallo sapere, che si andrà a controllare nella pagina il codice ed eventuali errori nella formattazione del codice automatico del programma...
... e se funzionerà si potrà cercare di sviluppare tramite a mia solita funzione sulle date un certo automatismo per ricavare la differenza date in giorni rimanenti...
.
ho provato per te...
http://www.mirboprova.altervista.org/@beta_14-2/--pagina-3.html
... ... urca .... ottimo! Mirko, grazie a TE, ...e vedo che non produce nenche errore html nella pagina...... ...strano, perchè nella v.7 quel tipo di inserimento mi dà errore (superabile!)...
... allora vedrò di adeguare la funzioneK, sperando che sia indolore, e poi te la giro per le tua prova finale; ... e se tutto va bene, prima della F1 sul c.8... (grazie rai!)
.
ciao Mirko, vado in F1 ...intanto vedi questo ... e nel caso ci risentiremo domani...
===== SCRIPT da incollare IN /HEAD =====
<script>
//===========scadenza K === x /HEAD =================
function controllodataK(giorno,mese,anno,numeroK){
mese = mese - 1;
scadenzaK=new Date(anno, mese , giorno);scadenzaK = scadenzaK.getTime();
oggiK=new Date();oggiK = oggiK.getTime();
differenza = scadenzaK - oggiK;
var giorniK = Math.floor(differenza / (1000 * 60 * 60 * 24))+1;
//alert(numeroK + " * " + giorniK);
if(giorniK >= 1) {
var giorniK = Math.floor(differenza / (1000 * 60 * 60 * 24))+1;
document.getElementById(numeroK).innerHTML = "scade tra " + giorniK + " giorni!";
}
if(giorniK == 0) {
document.getElementById(numeroK).innerHTML = "scade oggi!";
}
if(giorniK < 0) { document.getElementById(numeroK).innerHTML = "scaduto!!!";
}
}
</script>
======= incollare in CELLA 1 ==============================================
08/05/2018 <div id="num1" style="width:115px;font-size:10pt;background-color:yellow" ><img style="float:left" src="http://www.kolasim-zone.it/immagini/occhiorosso.png" onload="controllodataK(08,05,2018, 'num1')" />scade tra XX giorni</div>
======= incollare in CELLA 2 ==============================================
01/05/2018 <div id="num2" style="width:115px;font-size:10pt;background-color:yellow" ><img style="float:left" src="http://www.kolasim-zone.it/immagini/occhiorosso.png" onload="controllodataK(01,05,2018, 'num2')" />scade tra XX giorni</div>
======= incollare in CELLA 3 ==============================================
03/05/2018 <div id="num3" style="width:110px;font-size:10pt;background-color:yellow" ><img style="float:left" src="http://www.kolasim-zone.it/immagini/occhiorosso.png" onload="controllodataK(03,05,2018, 'num3')" />scade tra XX giorni</div>
======= incollare in CELLA 4 ==============================================
04/05/2018 <div id="num4" style="width:110px;font-size:10pt;background-color:yellow" ><img style="float:left" src="http://www.kolasim-zone.it/immagini/occhiorosso.png" onload="controllodataK(04,05,2018, 'num4')" />scade tra XX giorni</div>
===================================================
... ogni CELLA deve avere i suo doppio numX , nel ID e nella funzione controllodataK() e per la data, si intuisce...
04/05/2018 <div id="numX" style="width:110px;font-size:10pt;background-color:yellow" ><img style="float:left" src="http://www.kolasim-zone.it/immagini/occhiorosso.png" onload="controllodataK(04,05,2018, 'numX')" />scade tra XX giorni</div>
.
bye
.
dimenticato di avvisarti....fatto...
... ... grande! Mirko ... VISTO ... grazie ... anche il sorgente sembra pulito ...
... ciao, alla prossima ... ...
...
... mio > esempio base
.
direi che funziona alla Grande....
Autore
Ragazzi, scusatemi se rispondo solo ora ma ero impegnato personalmente e lavorativamente.
Quanto prima provo ad inserire il codice e vi faccio sapere.
Per il momento Vi ringrazio del prezioso supporto.
A presto