https://github.com/nolimits4web/atropos

Stunning touch-friendly 3D parallax hover effects
https://github.com/nolimits4web/atropos

cards effect gallery hover javascript parallax portfolio react showcase vue

Last synced: 24 days ago
JSON representation

Stunning touch-friendly 3D parallax hover effects

• Host: GitHub
• URL: https://github.com/nolimits4web/atropos
• Owner: nolimits4web
• License: mit
• Created: 2021-05-11T15:40:50.000Z (over 3 years ago)
• Default Branch: master
• Last Pushed: 2023-07-04T06:51:53.000Z (over 1 year ago)
• Last Synced: 2024-10-11T12:04:59.167Z (28 days ago)
• Topics: cards, effect, gallery, hover, javascript, parallax, portfolio, react, showcase, vue
• Language: JavaScript
• Homepage: https://atroposjs.com
• Size: 4.92 MB
• Stars: 3,301
• Watchers: 16
• Forks: 87
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Contributing: .github/CONTRIBUTING.md
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

• awesome-web-cn - atropos - 一个创建 3D 视差悬停效果的 JavaScript 库，支持 Vue，React 等框架具体效果可看[站点](https://atroposjs.com/) (Uncategorized / Uncategorized)

README

        


  



# Atropos

Atropos is a lightweight, free and open-source JavaScript library to create stunning touch-friendly 3D parallax hover effects.

Available for JavaScript, React and as a Web Component

## Community

The Atropos community can be found on [GitHub Discussions](https://github.com/nolimits4web/atropos/discussions), where you can ask questions, voice ideas, and share your projects

Our [Code of Conduct](https://github.com/nolimits4web/atropos/blob/master/CODE_OF_CONDUCT.md) applies to all Atropos community channels.

## Dist / Build

On production use files (JS and CSS) only from `package/` folder, there will be the most stable versions, `build/` folder is only for development purpose.

### Development Build

Install all dependencies, in repo's root:

```

$ npm install

```

And build development version of Atropos:

```

$ npm run build:dev

```

The result is available in `build/` folder.

### Running demos:

All demos located in `./playground` folder. There you will find Core (HTML, JS), React and Angular versions.

To open demo, run:

- **Core**: `npm run core`

- **React**: `npm run react`

### Production Build

```

$ npm run build:prod

```

Production version will available in `package/` folder.

## Contributing

All changes should be committed to `src/` files only. Before you open an issue please review the [contributing](https://github.com/nolimits4web/atropos/blob/master/CONTRIBUTING.md) guideline.