2016-04-13 18 views
1

Materialize design kullanıyorum. Başka bir resme tıkladıktan sonra başka bir görüntü açmak istiyorum.Resmi tıklayın Diğer görüntüyü döndürmek jquery

KODU:

<img id="prod-big-image" 
    class="materialboxed" style="width:100%;" 
    src="<catalog:ProductImageUrl 
    pictureId="${product.productPictureMappings[0].pictureId}" productName="${product.name}" 
    useCase="descriptionPageBig"/>" 
          alt="buy ${product.name}" title="${product.name}"> 
<div class="center-align"> 
    <c:forEach items="${product.productPictureMappings}" var="pic" varStatus="loopStatus"> 
     <a href="<catalog:ProductImageUrl pictureId="${pic.pictureId}" 
      productName="${product.name}" useCase="zoom"/>"> 
      <img class="abc" class="prod-zoom-img" 
       data-bigimgurl="<catalog:ProductImageUrl pictureId="${pic.pictureId}" productName="${product.name}" useCase="descriptionPageBig"/>" 
       width="60" src="<catalog:ProductImageUrl pictureId="${pic.pictureId}" productName="${product.name}" useCase="modal-giftbox"/>" 
       alt="view ${product.name}" title="${product.name}"> 
     </a> 
    </c:forEach> 
</div> 

EKRAN SHOT:
enter image description here

Küçük görüntüleri gerektiği tıklanamaz. Kullanıcı küçük resimlere tıklarsa büyük görüntü tetikleyici, küçük resimlerin yeri.

+0

Fotoğrafı Kaldır .. –

cevap

0

Yanıtım var, Bağlantı etiketi bağlantısını kaldır.

KODU:

<img id="prod-big-image" class="materialboxed n" style="width:100%;" src="<catalog:ProductImageUrl pictureId="${product.productPictureMappings[0].pictureId}" productName="${product.name}" useCase="descriptionPageBig"/>" 
          alt="buy ${product.name}" title="${product.name}"> 
         <div class="center-align"> 
          <c:forEach items="${product.productPictureMappings}" var="pic" varStatus="loopStatus"> 
           <a href="#"> 
            <img class="prod-zoom-img materialboxed abc" data-bigimgurl="<catalog:ProductImageUrl pictureId="${pic.pictureId}" productName="${product.name}" useCase="descriptionPageBig"/>" 
             width="60" src="<catalog:ProductImageUrl pictureId="${pic.pictureId}" productName="${product.name}" useCase="modal-giftbox"/>" alt="view ${product.name}" title="${product.name}"/> 
           </a> 
          </c:forEach> 
         </div> 

JQUERY:

$('.abc').click(function(){   
      $('.n').trigger('click'); 
     }); 

Eğer o zaman ilk önce bir resim yönlendirilecek bağlantı etiketi bağlantı ile görüntü alıyor. Ardından bağlantı etiket bağlantısını kaldırın.

İlgili konular