Share
Quale modo migliore per eseguire un progetto di comunità di progetti Web rispetto a CodePen? In questa, la prima di queste sfide, voglio che controlli la nostra penna di esempio, la forchetta e la migliori. Questo è tutto quello che devi fare. I migliori esempi saranno mostrati in una settimana o giù di lì!
Le voci per questa sfida sono ora chiuse: dai un'occhiata a ciò che ti è venuto in mente!
Un paio di settimane fa Jonathan ha scritto un tutorial sull'aggiunta di collegamenti di sezione dinamici a una pagina web. L'idea è che un frammento di JavaScript attraversi una pagina web, trovi tutto il intestazione di sezione, quindi aggiunge un collegamento a ciascuno di essi consentendo agli utenti di condividere quel collegamento.
Il link stesso è nascosto fino a quando l'utente passa sopra il titolo.
Ecco la demo di Jonathan su CodePenVogliamo che tu faccia sembrare fantastico questo link. Forse cambierai il testo per un'icona di qualche tipo? O rendere il collegamento molto più piccolo e dargli uno sfondo? Forse il cambio di opacità è un po 'sicuro per te, dagli un pizzico animato? Fai tutto ciò che vuoi, purché ciò avvenga all'interno dei registri della scheda CSS.
Ecco cosa devi fare, in pochi semplici passaggi.
Innanzitutto, vai alla demo su CodePen. Questo è quello che sembra:
Colpire il Forchetta per creare la tua copia personale, quindi apportare tutte le modifiche che desideri al CSS.
Se hai effettuato l'accesso a CodePen, puoi modificare la descrizione premendo il pulsante Informazioni pulsante. Usa questo per dare un'idea alla gente di quello che hai fatto.
Colpire Salvare, hai finito. Assicurati di farci sapere nei commenti quando hai finito, e sentiti libero di farcelo sapere twittando anche noi @wdtuts.
Questo è tutto! Tutte le voci verranno aggiunte a questa raccolta su CodePen e i migliori esempi verranno mostrati su Tuts + in una settimana circa!
Buona fortuna e non dimenticare di seguire Tuts + su Codepen!
Accentsconagua