https://imagenet3d.github.io/assets/js/mesh_viewer.js

1document.addEventListener("DOMContentLoaded", function() {
2    var container = document.getElementById("model-container");
3    var model1 = document.getElementById("model1");
4    var model2 = document.getElementById("model2");
5    var slider = document.getElementById("slider");
6
7    container.addEventListener("mousemove", function(e) {
8        var rect = container.getBoundingClientRect();
9        var position = (e.clientX - rect.left) / rect.width;
10        model1.style.clip = `rect(0, ${position * rect.width}px, ${rect.height}px, 0)`;
11        model2.style.clip = `rect(0, ${rect.width}px, ${rect.height}px, ${position * rect.width}px)`;
12        // Adjust slider position
13        slider.style.left = `${position * 100}%`;
14    });
15});