타운광장토픽게시판

search.gif

button.gif

 

상당히 재밌는 인터랙션이죠.

이전부터 메테리얼 디자인을 좋아했기 때문에 웹에도 적용하고 싶지만 구현방법을 몰라서 여태까지 놔두고 있었는데

버튼에 적용할 수 있는 라이브러리가 생겨서 바로 적용해봤습니다.

 

input, button 관련 버그가 조금 있는 것 같지만 나쁘지 않게 작동되는 것 같네요.

 

위에 검색창이 뜨는 효과는 리플 이펙트 적용하면서 함께 적용해봤습니다. 밋밋한 것보단 역동적인게 역시 최고죠.

 

 

버튼에 Ripple 효과를 적용해주는 라이브러리는 Waves.js입니다. (하단 링크 참조)

 

http://fian.my.id/Waves/

 

글쓴이 snax

profile
안녕하세요! Digital Product Designer, Calvin Snax입니다.
제 작업물을 확인해보시거나 작업을 의뢰하고 싶으신 분들은 제 사이트를 방문해주세요.
https://calvinsnax.com

XE & Rhymix 제작 자료
#HASHTAG 레이아웃: https://calvinsnax.com/hashtag
Alice 게시판 스킨: https://calvinsnax.com/alice
Slow 테마 패키지: https://calvinsnax.com/slow
coronach 레이아웃: https://calvinsnax.com/coronach
equeer 레이아웃: https://calvinsnax.com/equeer
eden 게시판 스킨: https://calvinsnax.com/eden
  • profile
    레이아웃 배포판에 포함시켜 주셔서 감사합니다 ^___^

    라이브러리 추가할 때마나 해외 CDN을 덕지덕지 붙여서 기하급수적으로 느려지는 레이아웃이 많은데, 이퀴어는 기능에 비해 놀라울 정도로 가벼워요.
  • profile profile
    뭔가 여러가지 덕지덕지 붙여놔서 점점 무거워지고 있어요ㅠㅠ
  • profile
    신기하네요 : )