Your browser does not support iframes. 이미지가 안나타날 경우 내부를 클릭하세요. 이미지를 클릭드래그하면 회전하고 하단의 메뉴를 클릭하면 애니메이션 됩니다. 애플의 HTML5 웹페이지 에 보면 Three Sixty라는 Show Case가 있습니다. 처음 로딩시 한번 360도 회전하고 이미지를 클릭드래그하면 원하는 방향에서 상품이미지를 볼 수 있도록 만들었습니다. 내용 설명에 의하면 HTML5와 CSS3, 자바스크립트로 작동한다고 되어 있고 Webkit 웹브라우저 엔진에서만 작동이 된다고 하지만 Gecko엔진을 사용하는 파이어폭스에서도 잘 나옵니다. 여담으로 웹브라우저애해서 알아보겠습니다. 현재 웹브라우저는 5대 브라우저가 있는데 웹킷 엔진을 사용하는 애플의 사파리와 구글의 ..
이전글 에서 하나의 버튼으로 두가지 기능을 하는 토글효과를 이용한 슬라이딩 메뉴를 알아보았는데 이것은 html요소를 위 아래로만 감추거나 나타나게 하고 좌우로 슬라이딩효과를 주려면 제이쿼리의 animate 기능을 이용합니다. 화면 밖에 감추었다가 버튼을 클릭하면 화면 안으로 나타나게 하는 슬라이딩 애니메이션 효과를 알아봅니다. 업그레이드 버전은 아래의 링크에 있습니다. https://martian36.tistory.com/1559 이글이 도움이 되셨다면 추천↑ 부탁드립니다. Toggle 에디터에 코드를 입력하고 웹브라우저에 실행하면 아래 데모링크처럼 잘 되는데 블로그에서는 열리고 닫는 두개의 이미지가 나타나지 않아서 하나의 이미지를 사용했습니다. 데모링크 링크 오른쪽에 배치할 경우의 파일은 아래를 사용하..