vue实现两张照片拖动对比效果代码-html代码-BFW代码库

vue实现两张照片拖动对比效果代码

代码语言：html

所属分类：拖放

代码描述：vue实现两张照片拖动对比效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue@2.6.1.js"></script>

     <style>
     
.container {
  height: 73.5vw;
  margin: 1vw auto;
  max-height: 750px;
  max-width: 1000px;
  overflow: hidden;
  width: 98vw;
}
.container figure {
  background-image: url(//repo.bfw.wiki/bfwrepo/image/60078abad6d5a.png);
  background-size: cover;
  font-size: 0;
  height: 100%;
  margin: 0;
  position: relative;
  width: 100%;
}
#compare {
  background-image: url(//repo.bfw.wiki/bfwrepo/image/60078a8d5f89d.png);
  background-size: cover;
  bottom: 0;
  border-right: 5px solid rgba(255,255,255,0.7);
  box.........完整代码请登录后点击上方下载按钮下载查看