From f3b6cd464227e15e8800a573d64c8e8e54b39a4e Mon Sep 17 00:00:00 2001
From: itorr <itorrrrrr@me.com>
Date: Fri, 12 Aug 2022 18:09:07 +0800
Subject: [PATCH] =?UTF-8?q?=E7=82=B9=E5=87=BB=E5=9B=BE=E5=83=8F=E5=AF=B9?=
 =?UTF-8?q?=E6=AF=94=E5=8E=9F=E5=9B=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 html/document.js   | 1 +
 html/document.less | 2 +-
 html/index.html    | 8 +++++++-
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/html/document.js b/html/document.js
index 6aedc34..8c25ada 100644
--- a/html/document.js
+++ b/html/document.js
@@ -175,6 +175,7 @@ const data = {
 	style,
 	runing: false,
 	convolutes,
+	diff: false,
 };
 
 
diff --git a/html/document.less b/html/document.less
index 1dd5fcb..8ae757b 100644
--- a/html/document.less
+++ b/html/document.less
@@ -67,7 +67,7 @@ canvas{
     canvas{
 
     }
-    &:active{
+    &[data-diff]{
         img{
             opacity: 1;
         }
diff --git a/html/index.html b/html/index.html
index 83bf4d3..895c71c 100644
--- a/html/index.html
+++ b/html/index.html
@@ -18,7 +18,13 @@
 		<!-- <img src="../one-last-image-logo-color.png"> -->
 	</header>
 	<div>
-		<div class="output-box" :data-cover="style.cover">
+		<div class="output-box" 
+			:data-cover="style.cover"
+			:data-diff="diff"
+			@touchstart.prevent="diff = true"
+			@touchend.prevent="diff = false"
+			@mousedown.prevent="diff = true"
+			@mouseup.prevent="diff = false">
 			<img src="images/asuka-8.jpg" @load="setImageAndDraw">
 			<canvas ref="canvas"></canvas>
 		</div>