스왑 이미지 및 쇼 이미지 확대

Question

일부 축소판 이미지를 표시하는 제품 페이지에 기능이있는 BigCommerce를 사용하는 웹 사이트가 있습니다. 사용자가 축소판 이미지를 클릭하면 해당 이미지에 대한 설명이 표시되고 왼쪽의 주 이미지를 선택한 축소판의 큰 버전으로 바꿔야합니다.

스크립트가 설명에 대해 표시/숨기기 부분을 올바르게 수행하고 있지만 주 이미지를 바꿀 수는 없습니다. 나는 누군가가 이것을 해결할 수 있을지 궁금해하고 있었다? BigCommerce에 연락했으나 도움을 줄 수없는 템플릿 관련 문제라고합니다.

웹 속성 검사에서 캐치되지 않는 유형 오류가 있으며 rel 태그의 'largeimage'속성이 없음을 나타냅니다. 나는 이것을 다시 넣으려고했으나 아무런 효과가 없었다.

감사합니다. 다른 곳에서 그렇게, this를 전달하는 ...

<a onclick="showProductThumbImage(2)" href="#"><img ... /></a> 

두 번째 인수가 요소에 대한 참조해야한다 :

Answer 1

당신은 두 개의 인수를 기대하는 기능 showProductThumbImage()을 가지고 있지만, 당신은 단지 예를 들어, 하나를 전달하는 아마 당신도 여기에서 똑같이해야합니다. 이 함수는 전달 된 요소가 JSON 문자열을 값으로 포함하는 rel 특성을 가질 것으로 기대합니다.

<a href="javascript:void(0);" 
    rel='{"gallery": "prodImage", "smallimage": "http://www.kriega.com/product_images/m/322/HY3home__49494_std.jpg", "largeimage": "http://www.kriega.com/product_images/h/328/HY3home__71324_zoom.jpg"}' 
><img ... /></a> 

당신은 showProductThumbImage()를 호출하는 링크로 위와 같이 JSON을 포함하는 rel 속성을 얻고, 두 번째 매개 변수로 this 전달해야합니다 : 올바른 보이는 rel 속성이 페이지에 숨겨진 요소가 있습니다

<a onclick="showProductThumbImage(2, this)" href="#" 
    rel='{"gallery": "prodImage", "smallimage": "http://www.kriega.com/product_images/m/322/HY3home__49494_std.jpg", "largeimage": "http://www.kriega.com/product_images/h/328/HY3home__71324_zoom.jpg"}' 
><img ... /></a>