Immagine / Laboratorio fotografico
Slider prima e dopo
Crea un confronto prima e dopo con etichette modificabili e uno slider in tempo reale. Scarica un file HTML portatile con entrambe le immagini incluse, una transizione GIF animata o un file WebM dove supportato.
Slider prima e dopo: Usa le proporzioni dell'immagine del prima e ritaglia al centro l'immagine del dopo per adattarla. Il download HTML contiene entrambe le immagini PNG come URI di dati e un proprio slider a intervallo accessibile da tastiera. Le transizioni GIF rientrano in 480 per 480 pixel; le transizioni WebM durano circa due secondi quando la registrazione nel browser è disponibile. Funziona al 100% localmente nel browser, senza caricare file sul server.
- Categoria
- Strumenti per immagini
- Esecuzioni
- Nel browser
- Costo
- Gratuito · senza registrazione
- Disponibilità
- Pronto all'uso
Funziona interamente nel browser
Confronto in tempo reale
Scegli entrambe le foto per confrontarle.
La registrazione WebM non è disponibile in questo browser. Scarica invece la transizione GIF.
Confronto portatile
Entrambe le immagini vengono normalizzate alle stesse proporzioni e incorporate nell'HTML come URI di dati PNG. Un input range nativo controlla l'area visibile dell'immagine successiva e supporta i tasti freccia. Il file contiene JavaScript inline, che potrebbe essere bloccato da policy di hosting restrittive.
Esportazioni animate
La disponibilità di WebM viene verificata prima della registrazione. GIF viene usato come fallback quando WebM o la cattura dal canvas non sono disponibili. Verifica del supporto a MediaRecorder: https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/isTypeSupported_static
Come usarlo
- Scegli le foto del prima e del dopo.
- Aggiungi le etichette e sposta lo slider di confronto.
- Scarica l'HTML per uno slider interattivo, oppure una GIF o un WebM supportato per una transizione animata.
Privacy e limitazioni
I tuoi input e le tue immagini restano nel browser. Non viene caricato nulla.
Strumenti correlati
Domande frequenti
L'HTML funziona offline?
Sì. Include entrambe le immagini e il codice dello slider in un unico file, senza richieste esterne.
Perché il WebM è disattivato?
Il browser deve supportare la registrazione WebM e l'acquisizione dal canvas. Quando queste funzioni non sono disponibili, usa la transizione GIF.
In cosa è diverso dallo slider di confronto delle immagini?
Questa pagina esporta uno slider HTML funzionante e transizioni animate. Lo slider di confronto delle immagini esporta un PNG statico, inclusi i layout affiancati.
Strumento gratuito · nel browser esecuzioni · senza account