1
package main
2

3
import "fmt"
4

5
func main() {
6
    fmt.Println("Hello, Hugo Stack!")
7
}
8
<style>
9
    .highlight {
10
        /* 你可以根据需要调整这个高度 */
11
        max-height: 400px;
12
        overflow: hidden;
13
    }
14

15
    .code-show {
16
        max-height: none !important;
17
    }
18

19
    .code-more-box {
20
        width: 100%;
21
        padding-top: 78px;
22
        background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(#fff));
23
        position: absolute;
24
        left: 0;
25
        right: 0;
26
        bottom: 0;
27
        z-index: 1;
28
    }
29

30
    .code-more-btn {
31
        display: block;
32
        margin: auto;
33
        width: 44px;
34
        height: 22px;
35
        background: #f0f0f5;
36
        border-top-left-radius: 8px;
37
        border-top-right-radius: 8px;
38
        padding-top: 6px;
39
        cursor: pointer;
40
    }
41

42
    .code-more-img {
43
        cursor: pointer !important;
44
        display: block;
45
        margin: auto;
46
        width: 22px;
47
        height: 16px;
48
    }
49
</style>
50

51
<script>
52
    function initCodeMoreBox() {
53
        let codeBlocks = document.querySelectorAll(".highlight");
54
        if (!codeBlocks) {
55
            return;
56
        }
57
        codeBlocks.forEach(codeBlock => {
58
            // 校验是否overflow
59
            if (codeBlock.scrollHeight <= codeBlock.clientHeight) {
60
                return;
61
            }
62
            // 元素初始化
63
            // codeMoreBox
64
            let codeMoreBox = document.createElement('div');
65
            codeMoreBox.classList.add('code-more-box');
66
            // codeMoreBtn
67
            let codeMoreBtn = document.createElement('span');
68
            codeMoreBtn.classList.add('code-more-btn');
69
            codeMoreBtn.addEventListener('click', () => {
70
                codeBlock.classList.add('code-show');
71
                codeMoreBox.style.display = 'none';
72
                // 触发resize事件，重新计算目录位置
73
                window.dispatchEvent(new Event('resize'))
74
            })
75
            // img
76
            let img = document.createElement('img');
77
            img.classList.add('code-more-img');
78
            img.src = {{ (resources.Get "icons/codeMore.png").Permalink }}
79
            // 元素添加
80
            codeMoreBtn.appendChild(img);
81
            codeMoreBox.appendChild(codeMoreBtn);
82
            codeBlock.appendChild(codeMoreBox)
83
        })
84
    }
85

86
    initCodeMoreBox();
87
</script>