有趣的小东西

2023年10月17日 839 字大概 4 分钟

有点用的小网站

主页导航网站（需要科学上网，有用但不多）

vscode好玩插件

1.code GPT（帮你联想代码，写注释）

github copilot 代码GPT

TONGYI Lingma （同等功能）

CodeGeeX （同等功能）

2.MD文件预览

Markdown Preview Github Styling

Markdown All in One

3.滑词翻译

Code Translate

4.代码截图

CodeSnap

安卓模拟器

博客pro

本博客用hexo为框架 kira为主题

kira-hexo

美化-添加好玩的玩意

● 添加鼠标点击爱心效果

找到/hexo-theme-kira文件夹里面/source/js 下新建文件 love.js，在 love.js 文件中添加以下代码：

!function(e,t,a){function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 500%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"),o(),r()}function r(){for(var e=0;e<d.length;e++)d[e].alpha<=0?(t.body.removeChild(d[e].el),d.splice(e,1)):(d[e].y--,d[e].scale+=.004,d[e].alpha-=.013,d[e].el.style.cssText="left:"+d[e].x+"px;top:"+d[e].y+"px;opacity:"+d[e].alpha+";transform:scale("+d[e].scale+","+d[e].scale+") rotate(45deg);background:"+d[e].color+";z-index:99999");requestAnimationFrame(r)}function o(){var t="function"==typeof e.onclick&&e.onclick;e.onclick=function(e){t&&t(),i(e)}}function i(e){var a=t.createElement("div");a.className="heart",d.push({el:a,x:e.clientX-5,y:e.clientY-5,scale:1,alpha:1,color:s()}),t.body.appendChild(a)}function c(e){var a=t.createElement("style");a.type="text/css";try{a.appendChild(t.createTextNode(e))}catch(t){a.styleSheet.cssText=e}t.getElementsByTagName("head")[0].appendChild(a)}function s(){return"rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"}var d=[];e.requestAnimationFrame=function(){return e.requestAnimationFrame||e.webkitRequestAnimationFrame||e.mozRequestAnimationFrame||e.oRequestAnimationFrame||e.msRequestAnimationFrame||function(e){setTimeout(e,1e3/60)}}(),n()}(window,document);

找到/hexo-theme-kira文件夹/layout/ 除了layout.ejs外，其他xx.ejs都要加少一个则不能全覆盖文件末尾添加以下代码：

1 2	`<!-- 页面点击小红心 --> <script type="text/javascript" src="/js/love.js"></script>`

完成以上操作后，当我们点击鼠标的时候就可以看见爱心的特效了

Live2D看板娘

（入门级）最基础的看板娘，用npm下载插件

1	`npm install --save hexo-helper-live2d`

这个模型数量有限，只能从别人配置好的里面挑

然后在 hexo 的配置文件_config.yml 中添加如下配置，详细配置可以参考文档

live2d:
  enable: true
  scriptFrom: local
  pluginRootPath: live2dw/
  pluginJsPath: lib/
  pluginModelPath: assets/
  tagMode: false
  debug: false
  model:
    use: live2d-widget-model-wanko
  display:
    position: right
    width: 150
    height: 300
  mobile:
    show: true
  react:
    opacity: 0.7

进阶自定义看板娘

https://github.com/stevenjoezhang/live2d-widget（这个是自定义模型，我用的这个）

自己找自己想要的模型文件，自定义自己想要的看板娘

剩下自己琢磨去，问就是我也忘了，反正挺麻烦的

动态线条背景

1 2	`<script type="text/javascript" color="255,192,203" opacity='1.0' zIndex="-2" count="750" src="//cdn.bootcss.com/canvas-nest.js/1.0.0/canvas-nest.min.js">`

zIndex表示在图层在最下层

count 代表线条的数量

搜索栏

我忘了