Countdown v3.0

« Older   Newer »
 
  Share  
.
  1. ninj@
         
     
    .

    User deleted


    Ciaoa,

    ottimo, come faccio a togliere la linea di contorno deldel riquadro?
     
    Top
    .
  2.      
     
    .
    Avatar

    Advanced Member

    Group
    Member
    Posts
    5,375
    Activity Level
    0

    Status
    Anonymous
    QUOTE (ninj@ @ 14/11/2013, 20:28) 
    Ciaoa,

    ottimo, come faccio a togliere la linea di contorno deldel riquadro?

    Che linea?
     
    Top
    .
  3. Without_Loved
         
     
    .

    User deleted


    Grazie mille è utilissimo
     
    Top
    .
  4. don_antonio
         
     
    .

    User deleted


    Non so perché a me non funziona, metto la data e l'ora, ma non fa nulla rimangono le scritte, quindi l'ho tolto :(, peccato mi piace.
     
    Top
    .
  5.      
     
    .
    Avatar

    Advanced Member

    Group
    Member
    Posts
    5,375
    Activity Level
    0

    Status
    Anonymous
    Linka il forum.
     
    Top
    .
  6. ANM-Admin
         
     
    .

    User deleted


    CITAZIONE (don_antonio @ 15/11/2013, 12:12) 
    Non so perché a me non funziona, metto la data e l'ora, ma non fa nulla rimangono le scritte, quindi l'ho tolto :(, peccato mi piace.

    idem lo stesso problema

    http://napolifanszone.forumfree.it/
     
    Top
    .
  7.      
     
    .
    Avatar

    Advanced Member

    Group
    Member
    Posts
    5,375
    Activity Level
    0

    Status
    Anonymous
    HTML
    <div class="countdown" data-countdown=".countdown_days, .countdown_hours, .countdown_minutes, .countdown_seconds {font-size: 30pt}">Mancano:<br><br>... giorni, ... ore, ... minuti e ... secondi
    <br><br>all'incontro con il parma.</div>

    È sbagliata questa sintassi, devi inserire in data-countdown="", l'orario e il giorno, tipo data-countdown="20:45 23/11/2013"
    Quindi negli HTML, inserisci, dove vuoi visualizzarlo:
    HTML
    <div class="countdown" data-countdown="20:45 23/11/2013">Mancano:<br><br>... giorni, ... ore, ... minuti e ... secondi
    <br><br>all'incontro con il parma.</div>

    Mentre nel CSS:
    CODE
    .countdown {width: 300px; background: linear-gradient(to bottom, rgb(162, 133, 137) 0%, rgb(52, 25, 27) 100%); border-radius: 7px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 1px rgba(162, 133, 137, 0.3) inset, 0 2px 5px rgba(0, 0, 0, 0.2); padding: 15px; font: 12pt/100% 'Trebuchet MS', Tahoma, Sans-serif; color: #fff; text-shadow: 0 -1px 0 #381E20}
    .countdown_days, .countdown_hours, .countdown_minutes, .countdown_seconds {font-size: 30pt}
     
    Top
    .
  8. ANM-Admin
         
     
    .

    User deleted


    CITAZIONE (Frostman @ 16/11/2013, 16:30) 
    HTML
    <div class="countdown" data-countdown=".countdown_days, .countdown_hours, .countdown_minutes, .countdown_seconds {font-size: 30pt}">Mancano:<br><br>... giorni, ... ore, ... minuti e ... secondi
    <br><br>all'incontro con il parma.</div>

    È sbagliata questa sintassi, devi inserire in data-countdown="", l'orario e il giorno, tipo data-countdown="20:45 23/11/2013"
    Quindi negli HTML, inserisci, dove vuoi visualizzarlo:
    HTML
    <div class="countdown" data-countdown="20:45 23/11/2013">Mancano:<br><br>... giorni, ... ore, ... minuti e ... secondi
    <br><br>all'incontro con il parma.</div>

    Mentre nel CSS:
    CODICE
    .countdown {width: 300px; background: linear-gradient(to bottom, rgb(162, 133, 137) 0%, rgb(52, 25, 27) 100%); border-radius: 7px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 1px rgba(162, 133, 137, 0.3) inset, 0 2px 5px rgba(0, 0, 0, 0.2); padding: 15px; font: 12pt/100% 'Trebuchet MS', Tahoma, Sans-serif; color: #fff; text-shadow: 0 -1px 0 #381E20}
    .countdown_days, .countdown_hours, .countdown_minutes, .countdown_seconds {font-size: 30pt}

    scusa la niubbaggine ho copiato i tuoi codici ma rimane il tutto come prima

    non è che potresti semplificarmi l'esempio?????

    grazie
     
    Top
    .
  9.      
     
    .
    Avatar

    Advanced Member

    Group
    Member
    Posts
    5,375
    Activity Level
    0

    Status
    Anonymous
    Vedrò di essere il più chiaro possibile.
    La base del codice si basa su l'attributo data-countdown, il cui il valore andrà inserito in questo formato hh:mm gg/mm/aaaa. Nel tuo caso, la partita Napoli - Parma si svolgerà il 23 Novembre 2013 alle 20.45, quindi il valore andrà scritto così 20:45 23/11/2013.
    Così avremo il div iniziale in questo modo:
    HTML
    <div class="countdown" data-countdown="20:45 23/11/2013"></div>

    Il countdown è pronto per funzionare, basta solo mostrarlo a video, quindi si lavora sulle classi:
    • .countdown_days, (i giorni rimanenti);
    • .countdown_hours, (le ore rimanenti);
    • .countdown_minutes, (i minuti rimanenti);
    • .countdown_seconds, (i secondi rimanenti);
    Quindi basterà inserirli in un elemento, per esempio il bold, che sarà contenuto nel div iniziale, ottenendo un risultato HTML finale:
    HTML
    <div class="countdown" data-countdown="20:45 23/11/2013">Mancano:<br>
    <b class="countdown_days"></b> giorni, <b class="countdown_hours"></b> ore, <b class="countdown_minutes"></b> minuti e <b class="countdown_seconds"></b> secondi<br> all'incontro con il Parma.</div>


    Alla fine è abbastanza inutile è molto personalizzabile, basta solo avere un po' di fantasia.
     
    Top
    .
  10. ANM-Admin
         
     
    .

    User deleted


    CITAZIONE (Frostman @ 16/11/2013, 17:56) 
    Vedrò di essere il più chiaro possibile.
    La base del codice si basa su l'attributo data-countdown, il cui il valore andrà inserito in questo formato hh:mm gg/mm/aaaa. Nel tuo caso, la partita Napoli - Parma si svolgerà il 23 Novembre 2013 alle 20.45, quindi il valore andrà scritto così 20:45 23/11/2013.
    Così avremo il div iniziale in questo modo:
    HTML
    <div class="countdown" data-countdown="20:45 23/11/2013"></div>

    Il countdown è pronto per funzionare, basta solo mostrarlo a video, quindi si lavora sulle classi:
    • .countdown_days, (i giorni rimanenti);
    • .countdown_hours, (le ore rimanenti);
    • .countdown_minutes, (i minuti rimanenti);
    • .countdown_seconds, (i secondi rimanenti);
    Quindi basterà inserirli in un elemento, per esempio il bold, che sarà contenuto nel div iniziale, ottenendo un risultato HTML finale:
    HTML
    <div class="countdown" data-countdown="20:45 23/11/2013">Mancano:<br>
    <b class="countdown_days"></b> giorni, <b class="countdown_hours"></b> ore, <b class="countdown_minutes"></b> minuti e <b class="countdown_seconds"></b> secondi<br> all'incontro con il Parma.</div>


    Alla fine è abbastanza inutile è molto personalizzabile, basta solo avere un po' di fantasia.

    grazie mille ora funzia

    io di codici non ci capisco nulla ho provato a fare le modifiche ma non visuallizzava nulla

    altra domanda
    se io volessi aggiunger gli stemmi delle 2 squadre inizio e fine che operazione dovrei fare?????
    tipo così stemma squadra A conteggio stemma squadra B
     
    Top
    .
  11.      
     
    .
    Avatar

    Advanced Member

    Group
    Member
    Posts
    5,375
    Activity Level
    0

    Status
    Anonymous
    Dovresti aggiungere l'HTML dell'immagine dove vuoi che venga visualizzata.
    HTML
    <img src="URL_IMMAGINE">

    Per altre informazioni ti consiglio di consultare una guida sull'HTML. www.html.it/guide/guida-html/
     
    Top
    .
  12. don_antonio
         
     
    .

    User deleted


    Sto facendo delle prove ma a me non funziona, non capisco il motivo.
    L'ho messo in questa sezione, ecco il link Sezione off topic
     
    Top
    .
  13.      
     
    .
    Avatar

    Senior Member

    Group
    M. Onorario
    Posts
    23,086
    Activity Level
    +9
    Location
    Far West

    Status
    Offline
    Da quanto vedo, non hai inserito lo script in cima al forum:
    HTML
    <script type="text/javascript" src="http://ffmagazine.forumfree.net/frostman/dev.js"></script>


    Senza questo, non funziona xD
     
    Top
    .
  14. don_antonio
         
     
    .

    User deleted


    Come al solito è un mio errore di procedura, adesso funziona.
    Grazie ;)
     
    Top
    .
  15.      
     
    .
    Avatar

    Advanced Member

    Group
    Member
    Posts
    1,553
    Activity Level
    0
    Location
    Altamura

    Status
    Offline
    grande!!!!! mi serviva....

    ma è possibile cambiare il colore????
     
    Top
    .
109 replies since 16/10/2013, 11:58   12025 views
  Share  
.
Top