Download raw (3.4 KB)
title: Exile author: Isabella Aurora summary: The practice of grafting observed extensively in the walnut trees surrounding the Beaulieu estate was the starting point for an online meditation script sewn together by the images of scar tissue in the bodies of participants of the Alchorisma summer camp. Tree and human bodies alike are here seen through the borderlines within their flesh that connect memory of times past and times to come. license: fal <section class="texture" markdown="1"> <div id="invert-scroll" markdown="1"> {.image-process-illustration--visuals} {.image-process-illustration--visuals} {.image-process-illustration--visuals} {.image-process-illustration--visuals} <!-- {.image-process-illustration--visuals} {.image-process-illustration--visuals} {.image-process-illustration--visuals} --> </div> </section> <section class="exile scroll-on-click" markdown="1"> {.image-process-illustration--visuals} {.image-process-illustration--visuals} {.image-process-illustration--visuals} <!-- {.image-process-illustration--visuals} --> {.image-process-illustration--visuals} {.image-process-illustration--visuals} {.image-process-illustration--visuals} <!-- {.image-process-illustration--visuals} --> {.image-process-illustration--visuals} {.image-process-illustration--visuals} {.image-process-illustration--visuals} <!-- {.image-process-illustration--visuals} --> {.image-process-illustration--visuals} </section> <script> $(window).on("scroll", function() { let screenHeight = $(window).height(); // the global scroll let currentScroll = $(window).scrollTop(); let ExileHeight = $(document).height() - screenHeight; let percentScroll = currentScroll/ExileHeight; console.log("percentScroll", percentScroll); // the texture opacity mouvement // let exileImagesNumber = $("section.exile").children().length; let textureImagesNumber = $("section.texture").children().first().children().length; let currentTextureImage = percentScroll * textureImagesNumber; console.log("currentTextureImage", currentTextureImage); let toTranslate = Math.floor(currentTextureImage) * screenHeight; let toOpacify = ((Math.abs((currentTextureImage % 1) - 0.5)*-1)+0.5)*2; $("#invert-scroll").css("transform", "translate3d(0, "+toTranslate+"px, 0)"); $("#invert-scroll").css("opacity", toOpacify); }); </script>