Hexo Butterfly主题页面美化

原创

于 2022-07-02 18:18:26 发布 · 930 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #javascript #ecmascript

本文介绍了如何使用jQuery和JavaScript为Hexo Butterfly主题添加冒泡、波浪和透明特效。详细步骤包括在不同部分应用这些特效，如首页、页脚和其他页面头部，提供了具体的方法和配置建议。

使用

冒泡特效

找个JS文件粘贴进去就行了</strong>（简单粗暴，但是要在主题配置里确定引用了的） ↓

JAVASCRIPT
// 气泡
function qipao() {
    $('#page-header').circleMagic({
        radius: 10,
        density: .2,
        color: 'rgba(255,255,255,.4)',
        clearOffset: 0.99
    });
}! function(p) {
    p.fn.circleMagic = function(t) {
        var o, a, n, r, e = !0,
            i = [],
            d = p.extend({ color: "rgba(255,0,0,.5)", radius: 10, density: .3, clearOffset: .2 }, t),
            l = this[0];

        function c() { e = !(document.body.scrollTop > a) }

        function s() { o = l.clientWidth, a = l.clientHeight, l.height = a + "px", n.width = o, n.height = a }

        function h() {
            if (e)
                for (var t in r.clearRect(0, 0, o, a), i) i[t].draw();
            requestAnimationFrame(h)
        }

        functi