Vous souhaitez comparer deux images en les dévoilant progressivement...
Il vous suffit de préparer deux images et d'utiliser la mini-application Double-image pour que la magie s'opère.
Vous pouvez également apporter un complément d’informations en remplaçant ce document PDF par le vôtre. Il s’ouvrira dans une nouvelle fenêtre en cliquant sur .
Cette mini-application a été développée en adaptant le script twentytwenty.
L'effet peut être paramétré en ouvrant le fichier index.html dans un éditeur de texte de type Notepad++ :
$(".demo").twentytwenty({
// Position de la séparation au chargement de la page (de 0 à 1)
default_offset_pct: 0.5,
// Orientation du déplacement (horizontal ou vertical)
orientation: 'horizontal',
// Textes affichés (pour le masquer, remplacer display:block; par display:none; dans la balise style de la ligne 12)
before_label: 'Avant',
after_label: 'Après',
// Opacité des images survolées (false ou true)
no_overlay: false,
// Déplacement en cliquant ou non sur la séparation (false ou true)
move_with_handle_only: true,
// Déplacement de la séparation en cliquant ou non sur une des images (false ou true)
click_to_move: true
});