0

私は非常に基本的な Javascript 関数を使用して、ユーザーがクリックしたサムネイルに応じて注目の画像を入れ替えています。画像は問題なく入れ替えられますが、タイトル/alt タグは、ページの読み込み時に表示されるデフォルトの注目の画像と常に同じままです。サムネイル画像が選択されているときに、サムネイル画像から alt/title タグを取得する方法を知りたいです。どんな助けでも大歓迎です！

UPDATEは、ROK のおかげで作業コードを反映するように編集されました!

HTML:

<div id="product-photos">

{% if product.images.size == 0 %}

  <div id="product-photo-container">
    <img src="{{ '' | product_img_url: 'grande' }}" title="{{ image.alt | escape }}" title="{{ image.alt | escape }}" alt="{{ image.alt | escape }}" />
  </div>

{% else %}

  <div id="product-photo-container">
    <img src="{{ product.featured_image.src | product_img_url: 'grande' }}" title="{{ product.featured_image.alt | escape }}" alt="{{ product.featured_image.alt | escape }}" />
  </div>

  {% if product.images.size > 1 %}
  <ul id="product-photo-thumbs" class="clearfix grid">
    {% for image in product.images %}
    <li class="product-photo-thumb">
      <a href="{{ image.src | product_img_url: 'grande' }}" data-title="{{ image.alt }}" data-alt="{{ image.alt }}">
        <img src="{{ image.src | product_img_url: 'small' }}" title="{{ image.alt | escape }}" alt="{{ image.alt | escape }}" />
      </a>
    </li>
    {% endfor %}
  </ul>
  {% endif %}      

{% endif %}

</div><!-- #product-photos -->

JavaScript:

// Load variant image into feature area
$('.product-photo-thumb a').click(function(e) { e.preventDefault();
    $elem = $(this);
    var newAttributes = {
        src: $elem.attr('href'),
        title: $elem.data('title'),
        alt: $elem.data('alt')
    }
    $('#product-photo-container img').attr(newAttributes);
});
4

1 に答える 1

1

このための Javascript は次のようになります。

// Load variant image into feature area
$('.product-photo-thumb a').click(function(e) { e.preventDefault();
    $elem = $(this).find('img')[0];
    var newAttributes = {
        src: $elem.attr('src'),
        title: $elem.attr('title'),
        alt: $elem.attr('alt')
    }
    $('#product-photo-container img').attr(newAttributes);
});

すべてのパラメーターを画像から直接読み取り、それらを特徴画像に再適用します。

于 2013-11-08T21:55:15.500 に答える