delete
icret
parent
8b860f8ce2
commit
c30958196e
|
|
@ -1,26 +0,0 @@
|
|||
# Donate-Page simple
|
||||
|
||||
<video class="share-video" id="share-video" poster="https://thumbs.gfycat.com/TatteredAlarmingCopperhead-poster.jpg" autoplay="" muted="" loop=""><source id="webmSource" src="https://zippy.gfycat.com/TatteredAlarmingCopperhead.webm" type="video/webm"><source id="mp4Source" src="https://zippy.gfycat.com/TatteredAlarmingCopperhead.mp4" type="video/mp4"><img title="Sorry, your browser doesn't support HTML5 video." src="https://i.imgur.com/yNz5vJc.gif"></video>
|
||||
|
||||
#### 直接 Fork 之后需要修改以下内容为你的账户
|
||||
|
||||
/script.js:4-6 对应账户的二维码路径
|
||||
|
||||
/index.html:28 PayPal.me 改为现在收款页面，这样可以删除原来的按钮方式了。
|
||||
|
||||
/index.html:37 `<input id="btc-key" type="text" value="比特币账号" readonly="readonly">`
|
||||
|
||||
#### 针对不同项目可以直接在 URL 加入项目参数和金额，不过仅仅作用于 PayPal 方式.
|
||||
|
||||
`https://kaiyuan.github.io/donate-page/simple/?item='donate-page&price=2'`
|
||||
|
||||
|
||||
#### 使用 `iframe` 嵌入页面的代码，高度至少 `240px`，宽度至少 `310px`！
|
||||
|
||||
```
|
||||
<iframe src="https://kaiyuan.github.io/donate-page/simple/" style="overflow-x:hidden;overflow-y:hidden; border:0xp none #fff; min-height:240px; width:100%;" frameborder="0" scrolling="no"></iframe>
|
||||
```
|
||||
|
||||
### License
|
||||
|
||||
Released under the MIT license.
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 56 KiB |
|
|
@ -1,46 +0,0 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 17.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" [
|
||||
<!ENTITY ns_extend "http://ns.adobe.com/Extensibility/1.0/">
|
||||
<!ENTITY ns_ai "http://ns.adobe.com/AdobeIllustrator/10.0/">
|
||||
<!ENTITY ns_graphs "http://ns.adobe.com/Graphs/1.0/">
|
||||
<!ENTITY ns_vars "http://ns.adobe.com/Variables/1.0/">
|
||||
<!ENTITY ns_imrep "http://ns.adobe.com/ImageReplacement/1.0/">
|
||||
<!ENTITY ns_sfw "http://ns.adobe.com/SaveForWeb/1.0/">
|
||||
<!ENTITY ns_custom "http://ns.adobe.com/GenericCustomNamespace/1.0/">
|
||||
<!ENTITY ns_adobe_xpath "http://ns.adobe.com/XPath/1.0/">
|
||||
]>
|
||||
<svg version="1.1" xmlns:x="&ns_extend;" xmlns:i="&ns_ai;" xmlns:graph="&ns_graphs;"
|
||||
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="448.5px" height="145.5px"
|
||||
viewBox="0 0 448.5 145.5" enable-background="new 0 0 448.5 145.5" xml:space="preserve">
|
||||
<switch>
|
||||
<g i:extraneous="self">
|
||||
<g id="椭圆_2_1_" enable-background="new ">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" fill="#074098" d="M105.611,0.046h-23.82v18.673H33.767v9.824h48.024v18.012
|
||||
H48.086v11.107H115.5c0,0-0.001,15.927-20.25,37.588c-20.249,21.661-27.836,24.915-37.5,27.75c-9.664,2.835-26.037,2.38-31.5-1.5
|
||||
c-5.463-3.88-11.751-8.9-11.25-18c0.501-9.1,11.884-19.412,18.877-20.523c0,0-20.044-2.206-24.544,18.106
|
||||
c-3.455,15.596,6.602,23.258,12.417,27.167s18.19,8.475,26.336,9c8.146,0.525,25.84-0.552,42.664-12.75
|
||||
c16.823-12.198,37.282-36.662,43.5-51.75c6.218-15.088,8.91-21.331,9.75-26.195h-38.389V28.543h50.234v-9.824h-50.234V0.046"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" fill="#074098" d="M186,0.046c0,0-2.498,21.476-33.75,44.954l3.595,5.25
|
||||
c0,0,13.926-5.466,17.401-8.25v80.25h24.732V25.5c0,0,12.021-12.461,12.022-25.454H186z"/>
|
||||
<polygon fill-rule="evenodd" clip-rule="evenodd" fill="#074098" points="245.961,0.046 245.961,27.004 202.485,27.004
|
||||
202.485,36.082 245.961,36.082 245.961,121.5 270.083,121.5 270.083,36.082 281.338,36.082 281.338,27.004 270.083,27.004
|
||||
270.083,0.046 "/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" fill="#074098" d="M364.452,0.046v11.216h46.508v7.456
|
||||
c0,22.097-14.212,24.825-14.212,24.825h-32.296v19.421h32.296v9.786h-32.296v45.75H339.75V72.75h-34.568v-9.786h34.568V43.543
|
||||
h-49.471V8.289h23.06v2.973h26.412V0.046H364.452z M313.338,21.521V34.53h77.412V21.521H313.338z"/>
|
||||
</g>
|
||||
<g id="椭圆_1_1_" enable-background="new ">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" fill="#ED6C1F" d="M44.099,136.744c0,0-22.471-3.673-32.099-20.494
|
||||
C8.33,109.839,7.958,97,18,88.5c8.357-7.074,19.518-6.553,33.75-3c14.232,3.553,24.419,8.078,42.75,17.25
|
||||
c18.486,9.25,44.916,22.501,78.656,29.647c33.741,7.146,52.273,9.357,72.805,10.853c35.377,2.577,149.409-2.407,164.998-6
|
||||
l37.541-39c0,0-112.934,17.355-183.75,18c-70.816,0.645-78.784-3.66-95.25-6.75c-16.466-3.09-59.859-17.214-72.75-22.5
|
||||
c-6.296-2.582-41.73-16.265-62.983-14.25S1.155,83.992,0.75,98.25S5.809,132.166,44.099,136.744z"/>
|
||||
|
||||
<rect x="206.624" y="46.661" transform="matrix(-0.7071 0.7071 -0.7071 -0.7071 421.6157 -51.5838)" fill-rule="evenodd" clip-rule="evenodd" fill="#ED6C1F" width="29.734" height="29.734"/>
|
||||
|
||||
<rect x="378.414" y="78.855" transform="matrix(-0.7071 0.7071 -0.7071 -0.7071 727.0344 -122.4926)" fill-rule="evenodd" clip-rule="evenodd" fill="#ED6C1F" width="20.945" height="20.945"/>
|
||||
</g>
|
||||
</g>
|
||||
</switch>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 3.5 KiB |
|
|
@ -1 +0,0 @@
|
|||
<?xml version="1.0" ?><svg baseProfile="tiny" height="24px" id="Layer_1" version="1.2" viewBox="0 0 24 24" width="24px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><g><path d="M14.435,12.973c0.269,0,0.492,0.133,0.686,0.396c0.192,0.265,0.294,0.588,0.294,0.975c0,0.385-0.102,0.711-0.294,0.973 c-0.193,0.265-0.417,0.396-0.686,0.396c-0.278,0-0.522-0.131-0.715-0.396c-0.192-0.262-0.294-0.588-0.294-0.973 c0-0.387,0.102-0.71,0.294-0.975C13.912,13.105,14.156,12.973,14.435,12.973 M17.875,9.414C18.621,10.225,19,11.209,19,12.367 c0,0.748-0.086,1.423-0.259,2.023c-0.175,0.597-0.394,1.084-0.654,1.459c-0.264,0.376-0.588,0.705-0.974,0.989 c-0.386,0.286-0.741,0.492-1.065,0.623c-0.325,0.132-0.695,0.233-1.111,0.306c-0.417,0.071-0.726,0.111-0.943,0.123 c-0.213,0.009-0.438,0.014-0.685,0.014c-0.055,0-0.243,0.004-0.547,0.015c-0.301,0.013-0.56,0.016-0.762,0.016 s-0.461-0.003-0.762-0.016c-0.304-0.011-0.492-0.015-0.547-0.015c-0.246,0-0.472-0.005-0.685-0.014 c-0.218-0.012-0.526-0.052-0.943-0.123c-0.423-0.072-0.786-0.174-1.111-0.306c-0.324-0.131-0.68-0.337-1.064-0.623 c-0.387-0.284-0.711-0.613-0.975-0.989c-0.261-0.375-0.479-0.862-0.654-1.459C5.086,13.79,5,13.115,5,12.367 c0-1.158,0.379-2.143,1.125-2.953C6.043,9.373,6.04,8.967,6.117,8.197C6.18,7.426,6.344,6.715,6.612,6.065 c0.934,0.099,2.09,0.629,3.471,1.581C10.549,7.527,11.184,7.463,12,7.463c0.852,0,1.491,0.064,1.918,0.184 c0.629-0.425,1.23-0.771,1.805-1.034c0.584-0.261,1.005-0.416,1.269-0.457l0.396-0.09c0.27,0.649,0.434,1.36,0.496,2.132 C17.96,8.967,17.957,9.373,17.875,9.414 M12.03,17.234c1.688,0,2.954-0.202,3.821-0.607c0.855-0.404,1.292-1.238,1.292-2.496 c0-0.73-0.273-1.34-0.822-1.828c-0.278-0.263-0.613-0.425-0.989-0.486c-0.375-0.061-0.949-0.061-1.72,0 c-0.769,0.062-1.298,0.09-1.582,0.09c-0.385,0-0.8-0.018-1.319-0.059c-0.52-0.04-0.928-0.065-1.223-0.078 c-0.294-0.009-0.609,0.027-0.958,0.108c-0.345,0.082-0.629,0.224-0.853,0.425c-0.521,0.469-0.79,1.077-0.79,1.828 c0,1.258,0.426,2.092,1.28,2.496c0.85,0.405,2.113,0.607,3.802,0.607H12.03 M9.596,12.973c0.268,0,0.492,0.133,0.685,0.396 c0.192,0.265,0.294,0.588,0.294,0.975c0,0.385-0.102,0.711-0.294,0.973c-0.192,0.265-0.417,0.396-0.685,0.396 c-0.279,0-0.522-0.131-0.716-0.396c-0.192-0.262-0.294-0.588-0.294-0.973c0-0.387,0.102-0.71,0.294-0.975 C9.073,13.105,9.316,12.973,9.596,12.973"/></g></g></svg>
|
||||
|
Before Width: | Height: | Size: 2.4 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 29 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 55 KiB |
|
|
@ -1,49 +0,0 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="-31 340.2 531.2 161.7" style="enable-background:new -31 340.2 531.2 161.7;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#64AB23;}
|
||||
.st1{fill:#A8A8A8;}
|
||||
</style>
|
||||
<g>
|
||||
<path class="st0" d="M37.6,340.2c-37.5-0.6-68.6,27-68.6,59.5c0,18.8,8.8,35,25.9,47c0,0-6.3,20.7-6.2,21.1c0.1,0.4,1.5,1.2,1.9,1
|
||||
s22.6-13.5,22.6-13.5c17,5.8,26.9,3.9,27.4,3.9c-1.7-5-2.8-12.7-1.5-20c6.6-38.1,45.6-50,67-47.9
|
||||
C100.2,363.6,74.6,340.7,37.6,340.2z M11.5,389.3c-4.9,0-8.9-4-8.9-8.9s4-8.9,8.9-8.9s8.9,4,8.9,8.9S16.4,389.3,11.5,389.3z
|
||||
M65.4,389.3c-4.9,0-8.9-4-8.9-8.9s4-8.9,8.9-8.9s8.9,4,8.9,8.9S70.4,389.3,65.4,389.3z"/>
|
||||
<path class="st1" d="M161,444.9c0-27.8-26.9-49.2-58.1-49.2c-33.1,0-59.4,21.8-59.4,49.6c0,27.9,25.1,51,59.5,51.2
|
||||
c6.9,0,17.2-1.7,24.2-4.6c0,0,16.6,10.1,17.5,10c0.9-0.1,1.4-0.8,1.4-1.4c0-0.6-5.3-16.4-5.3-16.4C155,472.9,161,460.6,161,444.9z
|
||||
M81.1,434.6c-4.4,0-7.9-3.5-7.9-7.9s3.5-7.9,7.9-7.9s7.9,3.5,7.9,7.9S85.4,434.6,81.1,434.6z M123.2,434.6c-4.4,0-7.9-3.5-7.9-7.9
|
||||
s3.5-7.9,7.9-7.9c4.4,0,7.9,3.5,7.9,7.9S127.6,434.6,123.2,434.6z"/>
|
||||
</g>
|
||||
<g>
|
||||
<g>
|
||||
<polygon class="st0" points="246.6,406.7 234.7,455.7 224.7,406.7 209.5,406.7 199.5,455.7 187.6,406.7 172.8,406.7 192.7,476.2
|
||||
206.2,476.2 217,423 227.8,476.2 241.4,476.2 261.3,406.7 "/>
|
||||
<path class="st0" d="M297.3,430c-4.3-4.7-10.3-7.1-18.2-7.1c-7.4,0-13.2,2.5-17.5,7.3c-4.3,4.9-6.4,11.5-6.4,19.9
|
||||
c0,8.6,2.2,15.3,6.5,20.3s10.2,7.5,17.6,7.5c6,0,11.1-1.5,15.3-4.6c4.2-3.1,7-7.3,8.4-12.7h-13.6c-0.9,1.9-2.1,3.4-3.6,4.1
|
||||
c-1.5,0.9-3.4,1.4-5.8,1.4c-3.4,0-5.9-1.1-7.7-3.1c-1.7-2-2.7-5.1-2.9-9.1h34.2c0-0.4,0.1-0.9,0.1-1.4s0-1.2,0-2.2
|
||||
C303.7,441.5,301.6,434.7,297.3,430z M269.4,445.1c0.3-3.4,1.3-6,3-7.9c1.7-1.8,4-2.7,7-2.7c3.2,0,5.7,0.9,7.4,2.7
|
||||
c1.8,1.8,2.7,4.4,2.8,7.9H269.4z"/>
|
||||
</g>
|
||||
<g>
|
||||
<path class="st1" d="M371.7,452.4L371.7,452.4C371.7,452.3,371.7,452.4,371.7,452.4L371.7,452.4z"/>
|
||||
<path class="st1" d="M352.4,461.9c-2.8,2.2-6.4,3.3-10.7,3.3c-6,0-10.6-2.1-13.9-6.2c-3.3-4.1-4.9-10-4.9-17.5
|
||||
c0-7.8,1.6-13.7,4.9-17.8c3.2-4.1,8-6.1,14.3-6.1c4.5,0,8,1,10.6,3.1c2.6,2.1,4.2,5.1,4.8,9h14.1c-0.5-7.9-3.4-14-8.5-18.3
|
||||
c-5.1-4.3-12.1-6.5-21-6.5c-10.9,0-19.3,3.1-25.1,9.4s-8.7,15.4-8.7,27.2c0,11.6,2.9,20.6,8.6,27c5.7,6.4,13.7,9.6,24,9.6
|
||||
c8.9,0,16.2-2.3,21.7-7c5.5-4.6,8.6-10.8,9.1-18.7h-13.9C357,456.5,355.2,459.7,352.4,461.9z"/>
|
||||
<path class="st1" d="M417.5,429.5c-1.5-1.9-3.5-3.4-5.9-4.4c-2.5-1.1-5.2-1.6-8.2-1.6c-3.2,0-6.1,0.6-8.6,1.8
|
||||
c-2.5,1.2-4.7,3-6.6,5.3v-23.9h-13.6V476h13.6v-30.4c0-3.3,0.9-6,2.8-7.9c1.9-1.9,4.5-2.9,7.7-2.9c3,0,5.2,0.7,6.3,2.4
|
||||
c1.1,1.7,1.7,5.7,1.7,12V476h13.6v-33.2v-0.9c0-3.7-0.2-6.3-0.6-8C419.3,432.3,418.5,430.8,417.5,429.5z"/>
|
||||
<path class="st1" d="M469.7,471.6c-0.5-1.1-0.7-2.7-0.7-4.8v-29.1c0-4.7-1.9-8.3-5.7-10.8s-9.3-3.7-16.5-3.7
|
||||
c-6.6,0-11.7,1.5-15.4,4.5s-5.6,7.1-5.6,12.4v0.9h12.8v-0.8c0-2,0.7-3.6,2.2-4.7c1.5-1.1,3.6-1.7,6.4-1.7c3.1,0,5.2,0.4,6.5,1.3
|
||||
c1.3,0.9,1.9,2.4,1.9,4.5c0,2.6-2.9,4.2-8.7,5c-2.3,0.3-4.2,0.6-5.6,0.8c-6.2,0.9-10.6,2.7-13.3,5.2c-2.7,2.6-4,6.3-4,11.1
|
||||
c0,5.2,1.3,9.3,4,12.1c2.7,2.8,6.5,4.2,11.5,4.2c3.7,0,7-0.7,9.8-2.1c2.8-1.4,5.1-3.4,6.8-6.1c0,1.2,0.2,2.4,0.4,3.6
|
||||
c0.3,1,0.6,2,1.1,2.9h14.3V474C470.9,473.4,470.1,472.7,469.7,471.6z M455.9,455.8c0,3.7-1.1,6.5-3.2,8.6c-2.1,2.1-5,3.1-8.7,3.1
|
||||
c-2.1,0-3.8-0.6-5-1.7c-1.2-1.1-1.8-2.6-1.8-4.5c0-1.8,0.4-3.3,1.4-4.3s2.7-1.9,5.1-2.6c0.1,0,1.6-0.4,4.5-1
|
||||
c2.9-0.6,5.5-1.5,7.7-2.5V455.8z"/>
|
||||
<path class="st1" d="M500.2,434.6V425h-7.9v-14h-13.6v14h-6.8v9.6h6.8v27.7c0,5.8,1,9.6,2.9,11.6c2,1.9,5.5,2.9,10.8,2.9
|
||||
c0.4,0,1.6,0,3.3-0.1c1.7-0.1,3.2-0.2,4.5-0.2h0v-10.2h-3.3c-1.9,0-3.1-0.2-3.7-0.6c-0.6-0.5-0.9-1.3-0.9-2.7v-28.4H500.2z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 3.8 KiB |
|
|
@ -1,367 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="zh">
|
||||
<style>
|
||||
html,
|
||||
html>body {
|
||||
margin: 0px !important;
|
||||
padding: 0px !important;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Helvetica Neue", Ubuntu, "WenQuanYi Micro Hei", Helvetica, "Hiragino Sans GB", "Microsoft YaHei", "Wenquanyi Micro Hei", "WenQuanYi Micro Hei Mono", "WenQuanYi Zen Hei", "WenQuanYi Zen Hei", "Apple LiGothic Medium", "SimHei", "ST Heiti", "WenQuanYi Zen Hei Sharp", Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
line-height: 1.8em;
|
||||
text-shadow: 0 0 1px rgba(255, 255, 255, 0.1);
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
img {
|
||||
border-width: 0px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
outline: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.list,
|
||||
.list li,
|
||||
.list-left li {
|
||||
list-style: none;
|
||||
list-style-type: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.pos-f {
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.left-100 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.blur {
|
||||
-webkit-filter: blur(3px);
|
||||
filter: blur(3px);
|
||||
}
|
||||
|
||||
.tr3 {
|
||||
transition: all .3s;
|
||||
}
|
||||
|
||||
#DonateText {
|
||||
position: fixed;
|
||||
font-size: 12px;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
color: #fff;
|
||||
background: #ffd886 url(images/like.svg) no-repeat center 10px;
|
||||
background-size: 20px;
|
||||
border-radius: 35px;
|
||||
text-align: center;
|
||||
left: calc(50% - 120px);
|
||||
top: calc(50% - 60px);
|
||||
z-index: -1;
|
||||
transform: rotatez(-15deg);
|
||||
}
|
||||
|
||||
#donateBox {
|
||||
left: calc(50% - 90px);
|
||||
top: calc(50% - 15px);
|
||||
background-color: #fff;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 6px;
|
||||
width: 150px;
|
||||
height: 28px;
|
||||
float: left;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#donateBox li {
|
||||
width: 74px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
border-left: 1px solid #ddd;
|
||||
background: no-repeat center center;
|
||||
background-color: rgba(204, 217, 220, 0.1);
|
||||
background-size: 45px;
|
||||
transition: all .3s;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
line-height: 600px;
|
||||
height: 28px;
|
||||
-webkit-filter: grayscale(1);
|
||||
filter: grayscale(1);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
#donateBox li:hover {
|
||||
background-color: rgba(204, 217, 220, 0.3);
|
||||
-webkit-filter: grayscale(0);
|
||||
filter: grayscale(0);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#donateBox>li:first-child {
|
||||
border-width: 0;
|
||||
}
|
||||
|
||||
#donateBox a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#donateBox #AliPay {
|
||||
background-image: url(images/alipay.svg);
|
||||
}
|
||||
|
||||
#donateBox #WeChat {
|
||||
background-image: url(images/wechat.svg);
|
||||
}
|
||||
|
||||
#QRBox {
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
background-color: rgba(255, 255, 255, 0.3);
|
||||
display: none;
|
||||
perspective: 400px;
|
||||
}
|
||||
|
||||
#MainBox {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
left: calc(50% - 100px);
|
||||
top: calc(50% - 100px);
|
||||
background: #fff no-repeat center center;
|
||||
background-size: 190px;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.3);
|
||||
opacity: 0;
|
||||
transition: all 1s ease-in-out;
|
||||
transform-style: preserve-3d;
|
||||
transform-origin: center center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#github {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
left: calc(50% + 50px);
|
||||
top: calc(50% - 30px);
|
||||
background: no-repeat center center url(images/github.svg);
|
||||
background-size: contain;
|
||||
opacity: 0.3;
|
||||
transform: rotatez(15deg);
|
||||
}
|
||||
|
||||
[data-footnote] {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
[data-footnote]:hover {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
[data-footnote]::before,
|
||||
[data-footnote]::after {
|
||||
position: absolute;
|
||||
transition: all .3s;
|
||||
transform: translate3d(-50%, 0, 0);
|
||||
opacity: 0;
|
||||
left: 37px;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
[data-footnote]::before {
|
||||
content: attr(data-footnote);
|
||||
border-radius: 6px;
|
||||
background-color: rgba(100, 100, 100, 0.8);
|
||||
color: #fff;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
padding: 0 6px;
|
||||
font-size: 12px;
|
||||
white-space: nowrap;
|
||||
top: -24px;
|
||||
left: 37px;
|
||||
}
|
||||
|
||||
[data-footnote]::after {
|
||||
content: '';
|
||||
border: 5px solid #333;
|
||||
border-color: rgba(100, 100, 100, 0.8) transparent transparent transparent;
|
||||
top: 0;
|
||||
left: 37px;
|
||||
}
|
||||
|
||||
[data-footnote]:hover::before,
|
||||
[data-footnote]:hover::after {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
[data-footnote]:hover::before,
|
||||
[data-footnote]:hover::after {
|
||||
transform: translate3d(-50%, -7px, 0);
|
||||
}
|
||||
|
||||
#MainBox.showQR {
|
||||
opacity: 1;
|
||||
animation-name: showQR;
|
||||
animation-duration: 3s;
|
||||
animation-timing-function: ease-in-out;
|
||||
animation-iteration-count: 1;
|
||||
animation-fill-mode: forwards;
|
||||
-webkit-animation: showQR 3s ease-in-out 0s 1 normal forwards;
|
||||
}
|
||||
|
||||
@keyframes showQR {
|
||||
from {
|
||||
transform: rotateX(90deg);
|
||||
}
|
||||
|
||||
8% {
|
||||
opacity: 1;
|
||||
transform: rotateX(-60deg);
|
||||
}
|
||||
|
||||
18% {
|
||||
opacity: 1;
|
||||
transform: rotateX(40deg);
|
||||
}
|
||||
|
||||
34% {
|
||||
opacity: 1;
|
||||
transform: rotateX(-28deg);
|
||||
}
|
||||
|
||||
44% {
|
||||
opacity: 1;
|
||||
transform: rotateX(18deg);
|
||||
}
|
||||
|
||||
58% {
|
||||
opacity: 1;
|
||||
transform: rotateX(-12deg);
|
||||
}
|
||||
|
||||
72% {
|
||||
opacity: 1;
|
||||
transform: rotateX(9deg);
|
||||
}
|
||||
|
||||
88% {
|
||||
opacity: 1;
|
||||
transform: rotateX(-5deg);
|
||||
}
|
||||
|
||||
96% {
|
||||
opacity: 1;
|
||||
transform: rotateX(2deg);
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#MainBox.hideQR {
|
||||
opacity: 1;
|
||||
animation-name: hideQR;
|
||||
animation-duration: 0.5s;
|
||||
animation-timing-function: ease-in-out;
|
||||
animation-iteration-count: 1;
|
||||
animation-fill-mode: forwards;
|
||||
-webkit-animation: hideQR 0.5s ease-in-out 0s 1 normal forwards;
|
||||
}
|
||||
|
||||
@keyframes hideQR {
|
||||
from {}
|
||||
|
||||
20%,
|
||||
50% {
|
||||
transform: scale(1.08, 1.08);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 0;
|
||||
transform: rotateZ(40deg) scale(0.6, 0.6);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Sponsor-打赏作者-简单图床 EasyImage2.0</title>
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0, minimal-ui" />
|
||||
<!--禁止缩放-->
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<a id="github" href="https://img.545141.com/" target="_blank" class="pos-f tr3" title="EasyImages 简单图床"></a>
|
||||
<div id="DonateText" class="tr3">打赏作者</div>
|
||||
<ul id="donateBox" class="list pos-f tr3">
|
||||
<li id="AliPay">AliPay</li>
|
||||
<li id="WeChat">WeChat</li>
|
||||
</ul>
|
||||
<div id="QRBox" class="pos-f left-100">
|
||||
<div id="MainBox"></div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/gh/icret/EasyImages2.0@2.2.0/public/static/zui/lib/jquery/jquery-3.4.1.min.js">
|
||||
</script>
|
||||
<script>
|
||||
jQuery(document).ready(function () {
|
||||
var QRBox = $('#QRBox');
|
||||
var MainBox = $('#MainBox');
|
||||
var AliPayQR = './images/alipay.jpg';
|
||||
var WeChanQR = './images/wechat.jpg';
|
||||
|
||||
|
||||
|
||||
function showQR(QR) {
|
||||
if (QR) {
|
||||
MainBox.css('background-image', 'url(' + QR + ')');
|
||||
}
|
||||
$('#DonateText,#donateBox,#github').addClass('blur');
|
||||
QRBox.fadeIn(300, function (argument) {
|
||||
MainBox.addClass('showQR');
|
||||
});
|
||||
}
|
||||
|
||||
$('#donateBox>li').click(function (event) {
|
||||
var thisID = $(this).attr('id');
|
||||
if (thisID === 'AliPay') {
|
||||
showQR(AliPayQR);
|
||||
} else if (thisID === 'WeChat') {
|
||||
showQR(WeChanQR);
|
||||
}
|
||||
});
|
||||
|
||||
MainBox.click(function (event) {
|
||||
MainBox.removeClass('showQR').addClass('hideQR');
|
||||
setTimeout(function (a) {
|
||||
QRBox.fadeOut(300, function (argument) {
|
||||
MainBox.removeClass('hideQR');
|
||||
});
|
||||
$('#DonateText,#donateBox,#github').removeClass('blur');
|
||||
}, 600);
|
||||
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</html>
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
jQuery(document).ready(function() {
|
||||
var QRBox = $('#QRBox');
|
||||
var MainBox = $('#MainBox');
|
||||
var AliPayQR = './images/alipay.jpg';
|
||||
var WeChanQR = './images/wechat.jpg';
|
||||
|
||||
|
||||
|
||||
function showQR(QR) {
|
||||
if (QR) {
|
||||
MainBox.css('background-image','url('+QR+')');
|
||||
}
|
||||
$('#DonateText,#donateBox,#github').addClass('blur');
|
||||
QRBox.fadeIn(300,function(argument) {
|
||||
MainBox.addClass('showQR');
|
||||
});
|
||||
}
|
||||
|
||||
$('#donateBox>li').click(function(event) {
|
||||
var thisID = $(this).attr('id');
|
||||
if (thisID === 'AliPay') {
|
||||
showQR(AliPayQR);
|
||||
} else if (thisID === 'WeChat') {
|
||||
showQR(WeChanQR);
|
||||
}
|
||||
});
|
||||
|
||||
MainBox.click(function(event) {
|
||||
MainBox.removeClass('showQR').addClass('hideQR');
|
||||
setTimeout (function(a) {
|
||||
QRBox.fadeOut(300,function(argument) {
|
||||
MainBox.removeClass('hideQR');
|
||||
});
|
||||
$('#DonateText,#donateBox,#github').removeClass('blur');
|
||||
},600);
|
||||
|
||||
});
|
||||
});
|
||||
|
|
@ -1,252 +0,0 @@
|
|||
html, html>body {
|
||||
margin: 0px !important;
|
||||
padding: 0px !important;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
body {
|
||||
font-family: "Helvetica Neue", Ubuntu, "WenQuanYi Micro Hei", Helvetica, "Hiragino Sans GB", "Microsoft YaHei", "Wenquanyi Micro Hei", "WenQuanYi Micro Hei Mono", "WenQuanYi Zen Hei", "WenQuanYi Zen Hei", "Apple LiGothic Medium", "SimHei", "ST Heiti", "WenQuanYi Zen Hei Sharp", Arial, sans-serif;
|
||||
-webkit-font-smoothing:antialiased;
|
||||
line-height: 1.8em;
|
||||
text-shadow: 0 0 1px rgba(255,255,255,0.1);
|
||||
background: #fff;
|
||||
}
|
||||
img {border-width: 0px;}
|
||||
a{
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
outline:none;
|
||||
border:none;
|
||||
}
|
||||
.list, .list li, .list-left li {
|
||||
list-style: none;
|
||||
list-style-type: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
.pos-f {
|
||||
position: fixed;
|
||||
}
|
||||
.left-100 {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.blur {
|
||||
-webkit-filter: blur(3px);
|
||||
filter: blur(3px);
|
||||
}
|
||||
.tr3 {
|
||||
transition: all .3s;
|
||||
}
|
||||
#DonateText {
|
||||
position: fixed;
|
||||
font-size: 12px;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
color: #fff;
|
||||
background: #ffd886 url(images/like.svg) no-repeat center 10px;
|
||||
background-size: 20px;
|
||||
border-radius: 35px;
|
||||
text-align: center;
|
||||
left: calc(50% - 120px);
|
||||
top: calc(50% - 60px);
|
||||
z-index: -1;
|
||||
transform: rotatez(-15deg );
|
||||
}
|
||||
#donateBox {
|
||||
left: calc(50% - 90px);
|
||||
top: calc(50% - 15px);
|
||||
background-color: #fff;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 6px;
|
||||
width: 150px;
|
||||
height: 28px;
|
||||
float: left;
|
||||
z-index: 1;
|
||||
}
|
||||
#donateBox li {
|
||||
width: 74px;
|
||||
float: left;
|
||||
text-align: center;
|
||||
border-left: 1px solid #ddd;
|
||||
background: no-repeat center center;
|
||||
background-color: rgba(204, 217, 220,0.1);
|
||||
background-size: 45px;
|
||||
transition: all .3s;
|
||||
cursor: pointer;
|
||||
overflow: hidden;
|
||||
line-height: 600px;
|
||||
height: 28px;
|
||||
-webkit-filter: grayscale(1);
|
||||
filter: grayscale(1);
|
||||
opacity: 0.5;
|
||||
}
|
||||
#donateBox li:hover {
|
||||
background-color: rgba(204, 217, 220,0.3);
|
||||
-webkit-filter: grayscale(0);
|
||||
filter: grayscale(0);
|
||||
opacity: 1;
|
||||
}
|
||||
#donateBox>li:first-child {
|
||||
border-width: 0;
|
||||
}
|
||||
#donateBox a {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#donateBox #AliPay {
|
||||
background-image: url(images/alipay.svg);
|
||||
}
|
||||
#donateBox #WeChat {
|
||||
background-image: url(images/wechat.svg);
|
||||
}
|
||||
#QRBox {
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
background-color: rgba(255,255,255,0.3);
|
||||
display: none;
|
||||
perspective: 400px;
|
||||
}
|
||||
#MainBox {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
left: calc(50% - 100px);
|
||||
top: calc(50% - 100px);
|
||||
background: #fff no-repeat center center;
|
||||
background-size: 190px;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0px 2px 7px rgba(0,0,0,0.3);
|
||||
opacity: 0;
|
||||
transition: all 1s ease-in-out;
|
||||
transform-style: preserve-3d;
|
||||
transform-origin: center center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#github {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
left: calc(50% + 50px);
|
||||
top: calc(50% - 30px);
|
||||
background: no-repeat center center url(images/github.svg);
|
||||
background-size: contain;
|
||||
opacity: 0.3;
|
||||
transform: rotatez(15deg );
|
||||
}
|
||||
[data-footnote] {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
[data-footnote]:hover {
|
||||
overflow: visible;
|
||||
}
|
||||
[data-footnote]::before, [data-footnote]::after {
|
||||
position: absolute;
|
||||
transition: all .3s;
|
||||
transform: translate3d(-50%,0,0);
|
||||
opacity: 0;
|
||||
left: 37px;
|
||||
z-index: 10;
|
||||
}
|
||||
[data-footnote]::before {
|
||||
content: attr(data-footnote);
|
||||
border-radius: 6px;
|
||||
background-color: rgba(100,100,100,0.8);
|
||||
color: #fff;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
padding: 0 6px;
|
||||
font-size: 12px;
|
||||
white-space: nowrap;
|
||||
top: -24px;
|
||||
left: 37px;
|
||||
}
|
||||
[data-footnote]::after {
|
||||
content: '';
|
||||
border: 5px solid #333;
|
||||
border-color: rgba(100,100,100,0.8) transparent transparent transparent;
|
||||
top: 0;
|
||||
left: 37px;
|
||||
}
|
||||
[data-footnote]:hover::before,[data-footnote]:hover::after {
|
||||
opacity: 1;
|
||||
}
|
||||
[data-footnote]:hover::before,[data-footnote]:hover::after {
|
||||
transform: translate3d(-50%,-7px,0);
|
||||
}
|
||||
|
||||
#MainBox.showQR {
|
||||
opacity: 1;
|
||||
animation-name:showQR;
|
||||
animation-duration:3s;
|
||||
animation-timing-function:ease-in-out;
|
||||
animation-iteration-count:1;
|
||||
animation-fill-mode:forwards;
|
||||
-webkit-animation:showQR 3s ease-in-out 0s 1 normal forwards;
|
||||
}
|
||||
@keyframes showQR {
|
||||
from {
|
||||
transform: rotateX(90deg);
|
||||
}
|
||||
8% {
|
||||
opacity: 1;
|
||||
transform: rotateX(-60deg);
|
||||
}
|
||||
18% {
|
||||
opacity: 1;
|
||||
transform: rotateX(40deg);
|
||||
}
|
||||
34% {
|
||||
opacity: 1;
|
||||
transform: rotateX(-28deg);
|
||||
}
|
||||
44% {
|
||||
opacity: 1;
|
||||
transform: rotateX(18deg);
|
||||
}
|
||||
58% {
|
||||
opacity: 1;
|
||||
transform: rotateX(-12deg);
|
||||
}
|
||||
72% {
|
||||
opacity: 1;
|
||||
transform: rotateX(9deg);
|
||||
}
|
||||
88% {
|
||||
opacity: 1;
|
||||
transform: rotateX(-5deg);
|
||||
}
|
||||
96% {
|
||||
opacity: 1;
|
||||
transform: rotateX(2deg);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
#MainBox.hideQR {
|
||||
opacity: 1;
|
||||
animation-name:hideQR;
|
||||
animation-duration:0.5s;
|
||||
animation-timing-function:ease-in-out;
|
||||
animation-iteration-count:1;
|
||||
animation-fill-mode:forwards;
|
||||
-webkit-animation:hideQR 0.5s ease-in-out 0s 1 normal forwards;
|
||||
}
|
||||
@keyframes hideQR {
|
||||
from {
|
||||
}
|
||||
20%,50% {
|
||||
transform: scale(1.08,1.08);
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
opacity: 0;
|
||||
transform: rotateZ(40deg) scale(0.6,0.6);
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue