Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
Tags
- clonecoding
- HTML
- react
- API
- pug
- CLONE
- form
- express
- NextJs
- javscript
- graphQL
- DART
- 리액트
- CSS
- Flutter
- JavaScript
- heroku
- node.js
- 자바스크립트
- frontend
- ES6
- TypeScript
- ECMAScript
- Session
- backend
- Mongoose
- GRID
- MongoDB
- Component
- nodejs
Archives
- Today
- Total
목록Slide (1)
Enjoy Programming

tailwind를 사용하던 중 오랜만에 slide animation을 구현할 일이 생겼다. 신규 beta launching 한 사이트 navigation에 text sliding 이다. 우선 거두 절미 tailwind에 custom animation은 tailwind config에서 이런식으로 설정 해주면 된다.. 근데.. 마우스를 올리면 해당 animation을 paused 시키고 싶었다. 찾아보니 css property 중에 animation-play-state 라는 것이 존재 했다. https://developer.mozilla.org/en-US/docs/Web/CSS/animation-play-state animation-play-state - CSS: Cascading Style Sheets |..
CSS/TailwindCss
2022. 11. 7. 21:55