← back to paste›Edit / fork

Untitled paste

#9WR596cBrFpublic / publicnew version

anonymous created 6 days ago Expires in 1 day 8.8 KB syntax: text

Your changes create a new paste linked to this one — the original is untouched.

new version Your changes create a new paste linked to this one — the original is untouched.

Visibility Public feed Access public

Change note (optional)

This paste will be listed on the public feed. Change Visibility if you only want people with the link to see it.

Cancel

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>静心木鱼</title>
<style>
*{margin:0;padding:0;box-sizing:border-box;font-family:"Microsoft YaHei",sans-serif;}
body{
  min-height:100vh;
  background:#f8f3eb;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:#5c4b3e;
}
.count-box{
  font-size:32px;
  margin-bottom:40px;
}
#count{font-weight:bold;font-size:48px;}
.muyu{
  width:260px;
  height:260px;
  background:#965a2f;
  border-radius:40% 40% 45% 45%;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow: 0 12px 20px #704422;
  transition: transform 0.08s ease;
  user-select:none;
}
.muyu:active{
  transform: scale(0.94);
  box-shadow:0 4px 8px #704422;
}
.muyu-text{
  color:#f8efe4;
  font-size:42px;
}
.tip{
  margin-top:40px;
  font-size:16px;
  opacity:0.75;
}
.reset{
  margin-top:24px;
  padding:8px 20px;
  border:1px solid #b8987b;
  background:transparent;
  color:#5c4b3e;
  border-radius:99px;
  cursor:pointer;
  font-size:16px;
}
.reset:hover{background:#efe6dd;}
</style>
</head>
<body>
<div class="count-box">静心次数：<span id="count">0</span></div>
<div class="muyu" id="muyu">
  <div class="muyu-text">木鱼</div>
</div>
<div class="tip">点击木鱼静心，敲一下记一次</div>
<button class="reset" id="resetBtn">重置计数</button>

<script>
let count = 0;
const countDom = document.getElementById('count');
const muyuDom = document.getElementById('muyu');
const resetBtn = document.getElementById('resetBtn');
//木鱼音效
const audio = new Audio("data:audio/wav;base64,UklGRl9vT19XQVZFZm10IBAAAAABAAEAQB8AAEAfAAABAAgAZGF0YU9vT19AAAAA//8CAP/+//8A/wD//gD+AP4A/gD9AP0A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD+AP4A/gD8APwA/gD+AP4A/gD+AP4A/gD+