1) Masonry 접속하여 원하는 레이아웃 선택하기 Masonry · Options Options All options are optional, but columnWidth and itemSelector are recommended. $('.grid').masonry({ columnWidth: 200, itemSelector: '.grid-item' }); var msnry = new Masonry( '.grid', { columnWidth: 200, itemSelector: '.grid-item' }); Recommended itemS masonry.desandro.com 2) jquery와 Masonry 연결하기 3) Java Script 작성하기 4) 박스 CSS 적용하기

위에 lightbox라고 적혀있는 링크를 누르게 되면 위에 사진 같은 팝업창이 생긴다. lightbox lightbox lightbox

위에 영상 처럼 팝업창 생성하는 방법을 알아보자! 1) 압축을 풀어준다. 2) Webapp 하단에 삽입해주기! / /

메뉴바를 클릭하면 목록이 주르륵 부드럽게 생성되고 마우스를 이동하면 글자색이 분홍색으로 변경될 수 있게 CSS를 적용하였다. HTML 목록 목록 목록 목록 목록 CSS 목록 목록 목록 목록 목록 JavaScript 목록 목록 목록 목록 목록 HTML 목록 목록 목록 목록 목록 CSS 목록 목록 목록 목록 목록 JavaScript 목록 목록 목록 목록 목록