一只小菜鸡的Blog

【网站美化】点击特效2

DODOLA 发布于 2023-12-19 更新于 2024-10-26, 收录于类别关于Hugo的一些设置

增加了一个鼠标追尾的效果 QwQ

添加文件的方式参考上一篇~指路这篇

`js`文件：

pointerfollow.js

js 原文件来源：Canva’s Magic Mouse Effect (codepen.io)

（我有稍微改了一些样式 qwq，写在代码里了。

`css`文件：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
.star {
  position: fixed;
  z-index: 2;
  color: white;
  font-size: 1rem;
  animation-duration: 1500ms;
  animation-fill-mode: forwards;
  pointer-events: none;
}

@keyframes fall-1 {
  0% {
    transform: translate(0px, 0px) rotateX(45deg) rotateY(30deg) rotateZ(0deg)
      scale(0.25);
    opacity: 0;
  }

  5% {
    transform: translate(10px, -10px) rotateX(45deg) rotateY(30deg) rotateZ(
        0deg
      )
      scale(1);
    opacity: 1;
  }

  100% {
    transform: translate(25px, 200px) rotateX(180deg) rotateY(270deg) rotateZ(
        90deg
      )
      scale(1);
    opacity: 0;
  }
}

@keyframes fall-2 {
  0% {
    transform: translate(0px, 0px) rotateX(-20deg) rotateY(10deg) scale(0.25);
    opacity: 0;
  }

  10% {
    transform: translate(-10px, -5px) rotateX(-20deg) rotateY(10deg) scale(1);
    opacity: 1;
  }

  100% {
    transform: translate(-10px, 160px) rotateX(-90deg) rotateY(45deg) scale(
        0.25
      );
    opacity: 0;
  }
}

@keyframes fall-3 {
  0% {
    transform: translate(0px, 0px) rotateX(0deg) rotateY(45deg) scale(0.5);
    opacity: 0;
  }

  15% {
    transform: translate(7px, 5px) rotateX(0deg) rotateY(45deg) scale(1);
    opacity: 1;
  }

  100% {
    transform: translate(20px, 120px) rotateX(-180deg) rotateY(-90deg) scale(
        0.5
      );
    opacity: 0;
  }
}

【网站美化】点击特效

DODOLA 发布于 2023-12-18 更新于 2024-10-26, 收录于类别关于Hugo的一些设置

今天摸鱼把网站的点击特效做了QwQ，选用的效果是烟花（/逆飞的流星🎆🎆，主要摸索了如何在Hugo里添加JavaScript代码

添加js文件

这次用到的两个js文件在这里：

anime.min.js

fireworks.js

在./static/下新建一个js文件夹，文件夹下新建两个js文件，命名为anime.min.js和fireworks.js，然后将上面两个文件的内容粘贴进去。

【网站美化】标签美化

DODOLA 发布于 2023-12-13 更新于 2024-10-26, 收录于类别关于Hugo的一些设置

简单设计

assets/css/common/terms.css添加：

1
2
3
4
5
6
7
.terms-tags{
    padding-left: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

添加权重

在./layouts/_default/terms.html中，找到这段代码并在a标签插入data-weight属性

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
<ul class="terms-tags">
    {{- $type := .Type }}
    {{- range $key, $value := .Data.Terms.Alphabetical }}
    {{- $name := .Name }}
    {{- $count := .Count }}
    {{- with site.GetPage (printf "/%s/%s" $type $name) }}
    <li>
        <a data-weight="{{$count}}" href="{{ .Permalink }}">{{ .Name }} <sup><strong><sup>{{ $count }}</sup></strong></sup> </a>
    </li>
    {{- end }}
    {{- end }}
</ul>

字体大小按权重显示

assets/css/common/terms.css中设计：

小机器人dodola，启动！

DODOLA 发布于 2023-12-06 更新于 2024-10-26, 收录于类别我们需要更多的鱼

拥有一个自己的小机器人不是超酷的么😎

本部分将从0开始介绍一个qq机器人的制作以及部署到服务器。

0.环境一览

开发环境：Windows11
python虚拟环境版本：3.10.9

队内拉题记录||23.11.29

DODOLA 发布于 2023-12-02 更新于 2024-10-26, 收录于类别在学算法的日子里

前言点评：本次题目难度不高

A 跳石头

[NOIP2015 提高组] 跳石头
题目背景
NOIP2015 Day2T1
题目描述
一年一度的“跳石头”比赛又要开始了！
这项比赛将在一条笔直的河道中进行，河道中分布着一些巨大岩石。组委会已经选择好了两块岩石作为比赛起点和终点。在起点和终点之间，有 $N$ 块岩石（不含起点和终点的岩石）。在比赛过程中，选手们将从起点出发，每一步跳向相邻的岩石，直至到达终点。