如果您觉得这个项目还不错, 可以在 Github 上面帮我点个star, 支持一下作者 ☜(ﾟヮﾟ☜)

Quick start

• 待更新...

features

• 支持初始化功能，初始化触发onload函数，可以做监听事件
• 支持步数、成功、失败等回调，开始/重置
• 支持自动划分格数，通过行数和列数自由组合
• 支持自定义动画时间，让拖拽丝滑般顺畅
• 支持自动寻路算法，可控制步数区间
• 基于 typescript，7KB Gzipped，支持服务端渲染
• 支持跨端使用，支持umd,esm等方式加载
• 附带零基础上手教程，快速学习，分步拆解讲解

Install

yarn add grid-picture

Basic usage:

const Picture = new GridPicture({
        url: "url",
        el: "#testRef",
        col: 3,
        row: 3,
        loadComplete: () => {
            // console.log('加载完毕')
        },
        onBlockMove: (steps, moveDom) => {
            // console.log('移动的DOM', moveDom)
        },
        success: (steps) => {
            // console.log('拼图成功')
        },
        beforeDestroy: () => {
            // console.log('加载完毕')
        }
})

License

MIT