Visualizzazione dei risultati da 1 a 3 su 3
  1. #1

    Transition per la proprietà text-decoration

    Salve, dopo svariate ricerche mi è parso di capire che l'animazione transition non può essere applicata per la proprietà text-decoration. Nello specifico, vorrei ritardare di 1s la comparsa della underline.

    Qualcuno sa darmi consigli e/o indicarmi vie alternative?

    Grazie.

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,675
    Ciao

    dopo svariate ricerche mi è parso di capire che l'animazione transition non può essere applicata per la proprietà text-decoration
    Ti è parso bene, text-decoration non è animabile ma la questione ha diverse sfaccettature. Tale proprietà possiede delle sotto-proprietà, una delle quali è text-decoration-color che è animabile. In quel caso è possibile definire transparent come valore iniziale e currentColor o un qualsiasi altro colore come valore finale della transizione con 1s di delay e il gioco è fatto. Purtroppo, però, questa sotto-proprietà è attualmente supportata da pochi browser per cui, se cerchi una soluzione cross-browser, dovrai optare per qualche espediente artificioso.

    Tra quelli più gettonati puoi adoperare un semplice border-bottom. Nel caso ti servisse invece creare un'animazione più complessa puoi usare uno pseudo elemento posizionato a dovere, oppure impostare un linear-gradient che ovviamente simuli e sostituisca la sottolineatura.

    Fai qualche prova.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  3. #3
    Ho optato per un border-bottom, è bastato ad ottenere l'effetto desiderato.

    Grazie mille, risposta chiara e molto utile.

    Un abbraccio

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.