Masonry Grid

2018년 12월 13일

Masonry Grid 구현 습작.

방문하기 · http://jw-masonry-grid.s3-website.ap-northeast-2.amazonaws.com/
깃헙 · https://github.com/Johnyworld/masonlygrid

핀터레스트 그리드로 유명한 메이슨리 그리드를 참 좋아했었고, 그걸 직접 구현해보고 싶었습니다. 처음에는 이걸 어떻게 구현할지 감도 안왔었고 구글링하면서 연구하여 마침내 구현 했던 작품입니다.

창의 크기를 조절하면 반응형 디자인이 적용됩니다.

그리드 뿐 아니라 사진을 선택하고 이전/다음으로 넘길 수 있습니다. 그걸 미려하게 잘 표현했던 것 같습니다.

  • jQuery

thumbnail