javascript - パス 私はhtmlとjavascriptで作られたこのス

Question

私はhtmlとjavascriptで作られたこのスライドショーを使用しています：http： //tympanus.net/codrops/2011/09/20/sensitive-image-gallery/

スライドショーは、大きな画像をクリックできない場合でもうまく機能します。それはプロパティを持っていますが、それらを機能させる方法があるので、画像をクリックして特定のリンク（href = ""に書いたリンク）に私を送るとき

これから値を取得します。

<div class="es-carousel">
  <ul>
    <li><a href="http://www.google.com">
      <img src="images/cityPlaces_images/thumbs/1.jpg" data-large="images/cityPlaces_images/1.jpg" alt="image01"
           data-description="From off a hill whose concave womb reworded" />
    </a></li>

そしてそれはこのgallery.jsで生成されます：

var $thumb    = $item.find('img'),
    largesrc  = $thumb.data('large'),
    title     = $thumb.data('description');

$('<img/>').load( function() {

    $rgGallery.find('div.rg-image').empty().append('<img src="' + largesrc + '"/>');

    if( title )
        $rgGallery.find('div.rg-caption').show().children('p').empty().text( title );

Answer 1

各サムに関連付けられた URL をdata-attribute要素のとして含めることができます。

 <div class="es-carousel">
  <ul>
    <li><a href="#">
      <img src="images/cityPlaces_images/thumbs/1.jpg" data-large="images/cityPlaces_images/1.jpg" alt="image01"
           data-description="From off a hill whose concave womb reworded"
           data-url="http://google.co.uk"/>
    </a></li>

そして、gallery.js コードを更新して、サムがタグimgでクリックされたときに大きな画像用に作成する要素をラップするようにします。a

var $thumb    = $item.find('img'),
    largesrc  = $thumb.data('large'),
    title     = $thumb.data('description');
    url       = $thumb.data('url');

$('<img/>').load( function() {

    $rgGallery.find('div.rg-image').empty().append('<a href="' + url + '"><img src="' + largesrc + '"/></a>');

    if( title )
        $rgGallery.find('div.rg-caption').show().children('p').empty().text( title );