{"id":13694976,"url":"https://github.com/bestvist/axial3d","last_synced_at":"2025-04-13T10:34:36.032Z","repository":{"id":57188573,"uuid":"155164071","full_name":"bestvist/axial3d","owner":"bestvist","description":"🎨 3D effect page for github404.","archived":false,"fork":false,"pushed_at":"2018-10-31T10:23:48.000Z","size":1770,"stargazers_count":138,"open_issues_count":0,"forks_count":11,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-27T01:51:31.306Z","etag":null,"topics":["3d","axial","github404","transfom"],"latest_commit_sha":null,"homepage":"https://bestvist.github.io/axial3d/demo/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bestvist.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-10-29T06:41:28.000Z","updated_at":"2024-09-25T11:26:49.000Z","dependencies_parsed_at":"2022-08-28T11:11:17.414Z","dependency_job_id":null,"html_url":"https://github.com/bestvist/axial3d","commit_stats":null,"previous_names":["bestvist/axial-3d"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bestvist%2Faxial3d","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bestvist%2Faxial3d/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bestvist%2Faxial3d/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bestvist%2Faxial3d/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bestvist","download_url":"https://codeload.github.com/bestvist/axial3d/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248699083,"owners_count":21147583,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["3d","axial","github404","transfom"],"created_at":"2024-08-02T17:01:54.267Z","updated_at":"2025-04-13T10:34:36.007Z","avatar_url":"https://github.com/bestvist.png","language":"JavaScript","funding_links":[],"categories":["JavaScript","目录"],"sub_categories":[],"readme":"# 轴动效果 axial3d \n![npm version](https://img.shields.io/npm/v/axial3d.svg)\n![npm downloads](https://img.shields.io/npm/dt/axial3d.svg)\n![MIT](https://img.shields.io/badge/license-MIT-blue.svg)\n\n\u003e 3D效果页插件，类似 Github404 页面动画。\n\n## 安装引入 Install\n\n```\nnpm install axial3d\n```\nor\n```\n\u003cscript src=\"https://unpkg.com/axial3d\"\u003e\u003c/script\u003e\n```\n\n## 例子 Example\n[Demo](https://bestvist.github.io/axial3d/demo/)\n\n```\n\u003chtml\u003e\n\u003chead\u003e\n    \u003ctitle\u003eDemo - Axial3d\u003c/title\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n    \u003cscript src=\"https://unpkg.com/axial3d\"\u003e\u003c/script\u003e\n    \u003cdiv id=\"axial3d\"\u003e\u003c/div\u003e\n    \u003cscript\u003e\n        (function () {\n            var options = {\n                selector: '#axial3d',\n                imgs: [\n                    {src: 'https://bestvist.github.io/axial3d/public/demo1/bg.png', left: '50px', top: '10px'},\n                    {src: 'https://bestvist.github.io/axial3d/public/demo1/2.png', left: '150px', top: '10px'},\n                    {src: 'https://bestvist.github.io/axial3d/public/demo1/3.png', left: '50px', top: '300px'},\n                    {src: 'https://bestvist.github.io/axial3d/public/demo1/4.png', left: '300px', top: '300px'}\n                ]\n            }\n            var effect = new Axial3d(options);\n        })()\n    \u003c/script\u003e\n\u003c/body\u003e\n\u003c/html\u003e\n```\n\n![](https://bestvist.github.io/axial3d/public/github404.gif)\n\n## 属性 Props\n\n### options\n\n| 属性 | 说明 | 类型 | 可选值 | 默认值 |\n|-|-|-|-|-|\n| selector | 元素选择器 | String | - | - |\n| imgs | 图片组 | Array | - | - |\n| transform | 动画形式 | String | translate / rotate | translate |\n| swing | 动画幅度 | Number | - | 5 |\n\n### imgs options\n\n| 属性 | 说明 | 类型 | 可选值 | 默认值 |\n|-|-|-|-|-|\n| src | 图像路径 | String | - | - |\n| top | 图片顶部定位 | String | - | - |\n| bottom | 图片底部定位 | String | - | - |\n| left | 图片左侧定位 | String | - | - |\n| right | 图片右侧定位 | String | - | - |\n| static | 图片是否静态，不随鼠标转动 | Boolean | true / false | false |\n\n## 方法 Methods\n\n| 事件名称 | 说明 | 回调参数 |\n|-|-|-|\n| destory | 取消事件监听 | - |\n\n\n## License\n\n[MIT](https://github.com/bestvist/axial3d/LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbestvist%2Faxial3d","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbestvist%2Faxial3d","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbestvist%2Faxial3d/lists"}