ZooMove jQuery 플러그인을 마우스로 가리켜 줌
전자 상거래 사이트를 탐색 한 적이 있다면 이미지 확대 효과. 제품 사진을 마우스로 가리키면 이미지의 일부가 더 선명한보기.
그만큼 ZooMove 플러그인 할 수있는 좋은 방법입니다. 이 효과를 복제하다 귀하의 사이트에. 그 jQuery에서 제공, 많은 코드없이이 기능을 빠르게 사용할 수 있습니다..
ZooMove는 완전히 무료이며 오픈 소스입니다. GitHub에서 어떤 호기심 많은 개발자들에게. 그것을 통해 설치할 수 있습니다 npm, 나무 그늘, 방사, 또는에서 직접 다운로드 CDNJS.
ZooMove 이미지를 설정하려면 3 개의 특정 파일 페이지 헤더에
- jQuery
- ZooMove CSS
- ZooMove JS
두 ZooMove 파일 축소 될 수있다. 빠른 페이지로드가 필요한 경우 CSS 파일을 기본 스타일 시트에 결합 할 수도 있습니다..
모든 진정한 마법은 HTML에서 가능합니다. HTML5 설정 데이터 - * 속성
다른 효과들.
이렇게하면 나만의 맞춤 확대 / 축소 효과 네 가지 매개 변수를 기반으로합니다.
데이터 - 동물원 규모
- 정의하다 호버링 할 때의 총 줌 크기 (예 : 200 %의 경우 2.0)데이터 - 동물원 - 이동
- 이미지가 커서와 함께 움직인다.데이터 - 동물원
- 확대 된 이미지를 정의합니다. 원래의 것 위에 나타난다.데이터 - 동물원 - 커서
- 정의하다 커서 포인트
마지막 다섯 번째 매개 변수를 사용하면 새 이미지 URL 해야합니다 (필요한 경우).
ZooMove는 IE9 +를 포함한 모든 주요 브라우저에서 사용할 수 있습니다. 이 플러그인은 널리 지원되는 사용자 경험 1 건을 제공합니다..
당신이 간편한 마우스 오버 - 줌 라이브러리 ZooMove는 탁월한 선택입니다. 그 충분히 가벼운 어떤 웹 사이트에서도 실행할 수 있으며 jQuery에서 제공, 그래서 당신은 그것을 작동시키기 위해서 많은 코드를 작성할 필요가 없을 것이다..
메인 페이지에서 GitHub에 대한 자세한 내용을 확인하십시오..