markdown 运行 html css js 实现看板娘
代码
123{% raw %}<script defer data-pjax src="https://cdn.jsdelivr.net/gh/stevenjoezhang/live2d-widget@latest/autoload.js"></script>{% endraw %}
效果
markdown 运行 html css js 实现网址标题副标题闪光
代码123{% raw %}<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/weilining/jsdelivr/css/title.butterfly@3.4.1.min.css">{% endraw %}
效果
#test-site-title {
color: rgb(255, 255, 255);
text-shadow: rgb(255, 255, 255) 0px 0px 10px,
rgb(255, 255, 255) 0px 0px 20px, rgb(255, 0, 222) 0px 0px 30px,
rgb(255, 0, 222) 0px 0px 40px, rgb(255, 0, 222) 0px 0px 70px,
rgb(255, 0, 222) 0px 0px 80px, rgb( ...
markdown 运行 html css js 实现鼠标滑动雪花
代码123{% raw %}<script async src="https://cdn.jsdelivr.net/gh/weilining/jsdelivr/javascript/mouse_snow/mouse_snow.min.js"></script>{% endraw %}
效果
markdown运行 html css js 实现黑客帝国
官方https://github.com/stevenjoezhang/canvas-matrix.js
代码1234567891011121314151617{% raw %}<style>#footer { background: 0;}#page-header { background-color: transparent;}[data-theme="light"] body { background: #0d0d0d;}[data-theme="dark"] #footer:before { background-color: transparent;}</style><script async src="https://cdn.jsdelivr.net/npm/canvas-matrix.js@0/canvas-matrix.min.js" size="20" ...
markdown运行 html css js 实现养鱼
参考https://codepen.io/K-T/pen/qQZwzQ
https://xiabor.com/714f.html#%E5%A6%82%E4%BD%95%E5%9C%A8%E9%A1%B5%E8%84%9A%E5%85%BB%E9%B1%BC
代码1234567{% raw %} <script defer src="https://rmt.dogedoge.com/fetch/~/source/jsdelivr/npm/jquery@latest/dist/jquery.min.js" ></script><script defer data-pjax src="https://cdn.jsdelivr.net/gh/weilining/jsdelivr/jquery/flyingfish/butterfly@3.4.1.flyingfish.min.js"></script>{% endraw %}
效 ...
markdown运行 html css js 实现水波纹特效
官方https://github.com/sirxemic/jquery.ripples
代码12345678910111213141516{% raw %} <script defer src="https://rmt.dogedoge.com/fetch/~/source/jsdelivr/npm/jquery@latest/dist/jquery.min.js" ></script> <script defer data-pjax src="https://cdn.jsdelivr.net/gh/sirxemic/jquery.ripples/dist/jquery.ripples.min.js" ></script> <script defer data-pjax src="https://cdn.jsdelivr.net/gh/weilining ...
markdown运行html css js 实现下雪
代码12345678910111213141516171819202122232425262728293031{% raw %}<style>#snow { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99999; pointer-events: none;}</style><div> <canvas id="snow"></canvas> <script defer src="https://rmt.dogedoge.com/fetch/~/source/jsdelivr/npm/jquery@latest/dist/jquery.min.js" ></script> <script> const notMobile = !navigator.userAgent.match ...
Hexo butterfly 实现aplayer全局吸底最小化
配置_config.butterfly.yml相应位置修改
12345678aplayerInject: enable: true per_page: trueinject: head: - <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/weilining/jsdelivr/css/aplayer.butterfly@3.4.1.min.css" media="defer" onload="this.media='all'"> bottom: - <div class="aplayer no-destroy" data-id="5183531430" data-server="netease" data-type="playlist" data-fixed="true" data ...
hexo butterfly 水波荡漾
群友需要
js没有文件请创建blog/source/js/ripples.js写下面代码
1234567891011$(document).ready(function () { try { $("#page-header").ripples({ resolution: 512, dropRadius: 10, //px perturbance: 0.04, }); } catch (e) { $(".error").show().text(e); }});
配置开启pjax123456inject: head: bottom: - <script defer src="https://rmt.dogedoge.com/fetch/~/source/jsdelivr/npm/jquery@latest/dist/jquery.min.js"></script& ...
hexo butterfly 加入顶部图
解决群友问题
顶部图本地没有请创建blog/source/img/bg.jpg
_config.butterfly.yml相应位置修改
1index_img: /img/bg.jpg
url_config.butterfly.yml相应位置修改
1index_img: "https://img.com/bg.jpg"
参考https://butterfly.js.org/posts/4aa8abbe
