给网页引入Party插件增加点击特效

这篇帖子就是演示效果

<script src="https://cdn.jsdelivr.net/npm/party-js@latest/bundle/party.min.js"></script>
<script>
        document.addEventListener('DOMContentLoaded', function() {
            // 检查 party.js 是否已正确加载
            if (typeof party === 'undefined') {
                console.error('Party.js is not loaded properly.');
                return;
            }

            // 为整个文档添加点击事件监听器
            document.addEventListener('click', function(event) {
                // 触发烟花效果
                party.sparkles(event, {
                    emitter: {
                        modules: [
                            new party.ModuleBuilder()
                                .drive("size")
                                .by(new party.NumericSpline({ time: 0, value: 0 }, { time: 0.5, value: 1 }, { time: 1, value: 0 }))
                                .build(),
                            new party.ModuleBuilder()
                                .drive("opacity")
                                .by((t) => t)
                                .through("size")
                                .build(),
                        ],
                    },
                });
            });
        });
</script>

请登录后发表评论

    没有回复内容