滑块HTML5开始位置之前/之后

我最近在codepen.io上遇到了this before/after slider。滑块HTML5开始位置之前/之后

但我有一个问题：如何更改滑块开始的位置。滑块开始诠释，他的中间，我没有看到这个代码，其中一个设置：

function trackLocation(e) { 
    var rect = videoContainer.getBoundingClientRect(), 
     position = ((e.pageX - rect.left)/videoContainer.offsetWidth)*100; 
    if (position <= 100) { 
    videoClipper.style.width = position+"%"; 
    clippedVideo.style.width = ((100/position)*100)+"%"; 
    clippedVideo.style.zIndex = 3; 
    } 
} 
var videoContainer = document.getElementById("video-compare-container"), 
videoClipper = document.getElementById("video-clipper"), 
clippedVideo = videoClipper.getElementsByTagName("video")[0]; 
videoContainer.addEventListener("mousemove", trackLocation, false); 
videoContainer.addEventListener("touchstart",trackLocation,false); 
videoContainer.addEventListener("touchmove",trackLocation,false);

来源

2017-06-14 Nino V. Gerwen

欢迎底部的堆栈溢出，请[参观]（https://stackoverflow.com/tour），确保你阅读了[我如何问一个好问题？]（https://stackoverflow.com/help/how-to-ask）和用更多的信息更新了你的问题。 – lordrhodos

对易读性进行少量编辑。 –

在CSS

#video-clipper video { 
    width: 450%; 
    postion: absolute; 
    height: 100%; 
    }

https://codepen.io/anon/pen/jwMwXB

来源

2017-06-14 11:44:47

是的，我发现了一个，但如果我调整宽度，它仍然在中间开始。它需要从左侧开始。 –

当你刷新页面时，奥克它有点儿马车，但它现在的作品，谢谢！是否有延迟2秒左右的方式，它可以滑到中间？ –

滑块HTML5开始位置之前/之后

回答

相关问题