le formule magiche

Membership - Indice generale

Raccolta di soluzioni, funzionalità e risorse rigorosamente selezionate e utili per la creazione e la gestione dei siti web.

Animazioni

Sommario:
  • Generatore di animazioni

  • Animazioni allo scroll

  • Animazioni onmouseover

    • Rassegna di animazioni onmouseover

    • Effetti zoom

    • I filtri (filter)

  • Animazioni automatiche
    • Titoli animati

    • Testo che scorre

    • Sequenza di immagini con fade

  • Rotazione automatiche e onmouseover

    • Rotazioni varie

    • Immagini che ruotano

    • Cartellino che dondola

Background

Sommario:
  • Background creati mediante le regole di stile

  • Background immagine con titolo centrato

  • Background immagine con testo

  • Background animati

    • Background immagine che cambia con titolo centrato

    • Background immagine che cambia con testo

    • Background immagine che cambia onmouseover con titolo centrato

    • Background che cambia colore con titolo centrato

    • Background gradiente animato con titolo centrato

    • Background che scorre

Date-ore-calendari

Sommario:
  • Data e ora varie combinazioni

  • Calendario eventi

  • Conto alla rovescia

Didascalie

Sommario:
  • Didascalie fisse

    • Didascalie fisse semplici

  • Didascalie animate onmouseover

    • Didascalie effetti vari

    • Didascalie diverse direzioni

I moduli (forms)

Sommario:
  • Modulo di contatto semplice

  • Modulo di contatto completo

  • Modulo di contatto con invio allegato

  • Modulo di contatto con archiviazione allegato

  • Modulo di contatto multistep

  • Modulo di prenotazione (booking)

  • Modulo di login semplice

  • Modulo per i commenti semplice

  • Soluzioni utili

    • Casella di ricerca interna

    • Pulsante per segnalazione anonima.

    • Notifica di click su un link

    • Click counter

    • Click counter per immagini con audio

    • Textarea con funzionalità salva in html/txt

    • Checkbox + textarea copy and delete

    • Checkbox select

    • Checkbox reset

    • Checkbox dropdown

    • Option select con avviso

    • Reset textarea

    • Preservare i campi compilati

    • Preservare i checkbox selezionati

    • Pulsante mostra password

    • Correggere visualizzazione input su iPhone

Gallerie

Sommario:
  • Galleria immagini uguale dimensione

  • Galleria immagini uguale dimensione con overlay

  • Galleria immagini diverse dimensioni

  • Galleria immagini diverse dimensioni con overlay

  • Galleria immagini diverse dimensioni auto riempitiva

  • Galleria immagini + video mp4 + video youtube con overlay

  • Galleria di tutte le immagini di una cartella con overlay

Slideshow

Sommario:
  • Slideshow manuale con fade

  • Slideshow manuale con video

  • Slideshow automatico con animazioni

  • Slideshow automatico con tasto pause/play

  • Slideshow automatico per testo

  • Slideshow automatico per testo + immagine

  • Slideshow automatico crossfade

  • Slideshow automatico staff

  • Slideshow esterni avanzati consigliati

Finestre modali - lightbox

Sommario:
  • Finestre modali varie con animazioni

  • Finestra modale personalizzata

  • Finestra modale crossfade

  • Finestre modali multiple con contenuti differenti

  • Image lightbox singola due versioni

Tabs

Sommario:
  • Tabs semplici

  • Tabs personalizzate

  • Tabs con stanze multiple

Vendita online

Sommario:
  • Vetrina prodotti vendita via PayPal

  • Box vendita prodotti

  • Prodotto singolo vendita

  • Calcolatore di prezzi

Menu

Sommario:
  • Menu orizzontale con tendina

  • Menu orizzontale con transizioni

  • Menu orizzontale con uscita laterale su mobile

  • Menu verticale laterale a comparsa (dx o sx)

  • Menu verticale laterale visibile

  • Menu verticale laterale visibile 2

  • Menu sticky

  • Menu verticale accordion

Footer

Sommario:
  • Footer tre colonne - logo, links, dati, social

  • Footer due colonne - logo, links, social, form

  • Footer due colonne - links, search box

  • Footer due colonne - links, social

Layout

Sommario:
  • Layout HTML5 classico

  • Layout HTML5 2 colonne

  • Layout HTML5 3 colonne

  • Layout HTML5 full page

  • Layout HTML5 parallax semplice

  • Layout HTML5 paralax avanzato

Pagine-struttura-funzionalità

Sommario:
  • Griglie di box vari

    • Box vari count

    • Box vari grid

    • Box vari flex

  • Elementi fissi right, left, bottom

  • Preload

    • Preload 1 a sipario

    • Preload 2 con fade

    • Preload 3 a cortina

    • Preload 4 roll

    • Serie di animazioni per preload

  • Redirect

  • Scroll to top

  • Sommario di titoli e sottotitoli di una pagina

  • Watermark per pagina web

  • Div inclinati

    • Div con lati orizzontali inclinati

    • Div con lato verticale inclinato

  • Lente di ingrandimento

  • Tooltip onclick

Grafica

Sommario:
  • Box-shadow

    • Box-shadow generator

    • Box-shadow effetti 3D

  • Text-shadow

    • Text-shadow generator

    • Text-shadow effetti 3D

  • Text-fill-color

    • Text-fill-color on background image
  • Clip-path

    • Clip-path generator

    • Clip-path effetti

    • Clip-path animation - rassegna

  • Mask-image

    • Mask-image effetti

  • Transform perspective

    • Transform perspective effetti

  • Gradients

    • Gradient generator 2 colors

    • Gradient generator 3 colors

    • Gradient animation1

    • Gradient animation2

  • Overlapping images - immagini sovrapposte

  • Post-it

    • Post-it classico

    • Post-it transform

    • Post-it transform rotate

  • Testo opaco su immagine semi-trasparente

Video

Sommario:
  • Player per video mp4 con lightbox

  • Player per video youtube con lightbox

  • Player per tutti i video

  • Video con immagine sovrapposta

  • Video come background

Varie

(member only)
Sommario:
  • Fonts

    • Rassegna di diversi tipi di fonts

  • Icon sprite

    • Icon sprite pack scaricabili

    • Icon sprite social con script jQuery per global url

  • Icona per link esterni

    • Immagine svg

    • Immagine png

  • Mappe

    • Mappa responsive asincrona

  • Cookie Law

    • Script per la gestione dei cookie secondo la normativa italiana

  • Casella di ricerca via Google Search

    • Casella di ricerca nel sito web + file risultati

  • Watermark

    • Watermark da applicare alle pagine web

Soluzioni HTML

(member only)
Sommario:
  • Body - disattivazione delle funzioni per l'utente

  • Aprire tutti i link della pagina in una nuova scheda

  • Pulsante che apre una finestra di avviso

  • Contenuto espandibile

  • Numero di telefono cliccabile

  • Color picker inline

  • Link con errore

  • Andare a capo in un tooltip

Soluzioni CSS

(member only)
Sommario:
  • Altezza pagina 100%

  • Oscillazione laterale su mobile

  • Scrolling div padding

  • Distanziare elenco da immagine float

  • Proseguire con il testo sotto a immagine float

  • Impedire la separazione di due parole

  • Centrare un elemento in posizione fissa o assoluta nel suo contenitore

  • Div inclinato con testo non inclinato

  • Trasparenza e opacità

  • Testo evidenziato

  • Evidenziare il contenuto al click

  • Stile della linea orizzontale

  • Separare un elenco orizzontale con linee verticali

  • Effetto onmouseover su elemento padre e figlio

  • Disattivare le animazioni

  • Mobile Safari - background-image

  • Mobile Safari - fissare dimensioni testo

  • Mobile Safari - attivare scroll

  • Mobile Safari - forzare stile input

  • Tipi di cursore

  • Colori particolari

Soluzioni Javascript/PHP

(member only)
Sommario:
  • Andare a capo in javascript

  • Multiple funzioni in un unico Onclick

  • Adblock redirect scrip

  • Adjust Iframes script

  • Cambiare il colore della pagina

  • Color picker con javascript

  • Script per visualizzare l'anno corrente

  • Torna alla pagina precedente

  • Redirect con conto alla rovescia

  • Download + redirect

  • Data dell'ultimo aggiornamento di una pagina web

  • Pulsante aggiorna pagina

  • Pulsante per attivare notifiche web push

  • Copiare testo al click

  • Disabilitare tasto dx, trascinamento e selezione di un contenuto

  • Disabilitare il tasto dx sulle immagini

  • Escludere funzioni secondo la dimensione dello schermo

  • Mostra tutte le immagini di una cartella

  • Riproduci tutti i video di una cartella

  • Disabilitare lo scroll del body quando è aperto un popup con scroll attivo

Argomenti del sito utili ai webmaster: