{"id":4587,"date":"2017-07-30T15:42:31","date_gmt":"2017-07-30T15:42:31","guid":{"rendered":"http:\/\/www.ticeman.fr\/lecoutelas\/?p=4587"},"modified":"2018-07-21T13:31:59","modified_gmt":"2018-07-21T13:31:59","slug":"juxtapose-js-juxtaposer-des-photographies-pour-les-comparer","status":"publish","type":"post","link":"https:\/\/www.ticeman.fr\/lecoutelas\/?p=4587","title":{"rendered":"Juxtapose JS: juxtaposer des photographies pour les comparer"},"content":{"rendered":"<p>Un service en ligne extr\u00eamement pratique r\u00e9alis\u00e9 par les concepteur du d\u00e9j\u00e0 c\u00e9l\u00e8bre Timeline JS. Le principe est simple, il permet de comparer deux photographies gr\u00e2ce \u00e0 un syst\u00e8me de glissement. Le principe est id\u00e9al pour comparer deux images prises sous le m\u00eame angle \u00e0 des dates diff\u00e9rentes notamment. Pour faire simple, voici un exemple ci-dessous.<\/p>\n<p><iframe loading=\"lazy\" class=\"juxtapose\" src=\"https:\/\/cdn.knightlab.com\/libs\/juxtapose\/latest\/embed\/index.html?uid=a5a4af60-72b8-11e7-b5f8-0edaf8f81e27\" width=\"100%\" height=\"762\" frameborder=\"0\"><\/iframe><\/p>\n<p>Et comme habituellement avec les productions de Knightlab, pour r\u00e9aliser cela, rien de bien difficile. Il vous faudra simplement fournir les adresses deux deux images que vous voulez comparer et d&#8217;indiquer une l\u00e9gende pour chacune d&#8217;entre elle. Pour l&#8217;exemple, je me suis donc content\u00e9 de Avant et Apr\u00e8s.<\/p>\n<p><a  href=\"http:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-creation.png\" data-rel=\"lightbox-gallery-0\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-medium wp-image-4589\" src=\"http:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-creation-300x274.png\" alt=\"\" width=\"300\" height=\"274\" srcset=\"https:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-creation-300x274.png 300w, https:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-creation-768x702.png 768w, https:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-creation-1024x936.png 1024w, https:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-creation.png 1047w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>Une fois les \u00e9l\u00e9ments en place, il suffit de g\u00e9n\u00e9rer le fichier. Imm\u00e9diatement, vous pourrez visualiser le r\u00e9sultat et le service vous fournit l&#8217;adresse o\u00f9 il sera disponible ainsi qu&#8217;un code d&#8217;int\u00e9gration permettant de l&#8217;int\u00e9grer sur votre site, blog ou ENT, comme je l&#8217;ai fait ici.<\/p>\n<p><a  href=\"http:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-integration.png\" data-rel=\"lightbox-gallery-0\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-medium wp-image-4590\" src=\"http:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-integration-300x154.png\" alt=\"\" width=\"300\" height=\"154\" srcset=\"https:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-integration-300x154.png 300w, https:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-integration-768x394.png 768w, https:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-integration-1024x525.png 1024w, https:\/\/www.ticeman.fr\/lecoutelas\/wp-content\/uploads\/2017\/07\/juxtapose-integration.png 1918w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>Le service est bien entendu gratuit et surtout sans publicit\u00e9. Il ne n\u00e9cessite aucune inscription.<\/p>\n<p>Lien: <a href=\"https:\/\/juxtapose.knightlab.com\" target=\"_blank\" rel=\"noopener\">Juxtapose JS<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Un service en ligne extr\u00eamement pratique r\u00e9alis\u00e9 par les concepteur du d\u00e9j\u00e0 c\u00e9l\u00e8bre Timeline JS. Le principe est simple, il permet de comparer&hellip;<a href=\"https:\/\/www.ticeman.fr\/lecoutelas\/?p=4587\" class=\"more-link\"><span class=\"more-button\">Continuez la lecture<span class=\"screen-reader-text\">Juxtapose JS: juxtaposer des photographies pour les comparer<\/span><\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":4589,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[51,87,14,116],"tags":[],"class_list":["post-4587","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-creation","category-creer-des-sites-web-et-presentations-interactives","category-images","category-rendre-des-images-interactives"],"_links":{"self":[{"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=\/wp\/v2\/posts\/4587"}],"collection":[{"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=4587"}],"version-history":[{"count":2,"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=\/wp\/v2\/posts\/4587\/revisions"}],"predecessor-version":[{"id":4591,"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=\/wp\/v2\/posts\/4587\/revisions\/4591"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=\/wp\/v2\/media\/4589"}],"wp:attachment":[{"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=4587"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=4587"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.ticeman.fr\/lecoutelas\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=4587"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}