2012-04-19 8 views
0

私はfancyboxの親指が正しく動作するようにしようとしています。jquery fancybox親指 - いいえ、いいえ - スライドショーなし

私はすべてのjs/cssファイルをインポートしましたが、クリックした画像(サムイとスライドショーなし)のみが表示されます。私は同じページ内のすべての画像をファンシーボックス(親指付き)と "alt"属性に各画像のタイトルとしてロードします。

HTML:

..... 
<a class="fancybox-thumb" rel="fancybox-thumb" href="/test.jpg"> 
    <img src="test.jpg" alt="text showing"> 
</a> 
..... 
...... 
<a class="fancybox-thumb" rel="fancybox-thumb" href="/awesome.jpg"> 
    <img src="awesome.jpg" alt="Awesome"> 
</a> 

Javascriptを

$('.fancybox-thumb').each(function() { 
$(this).attr('rel', 'fancybox-thumb').fancybox({ 
    helpers: { 
     type: 'image', 
     openEffect : 'none', 
     closeEffect : 'none', 
     title : { 
      type: 'inside' 
     }, 
     overlay : { 
      opacity: 0.8, 
      css: { 
       'background-color' : '#000' 
      } 
     }, 
     thumbs : { 
      width: 50, 
      height: 50 
     } 
    }, 
    beforeLoad: function() { 
     this.title = $(this.element).find('img').attr('alt'); 
     this.href = $(this.element).find('img').attr('src').replace('_thumb', ''); 
    } 
}); 
}); 

SOLUTION

$('.fancybox-thumb').fancybox({ 
prevEffect: 'none', 
nextEffect: 'none', 
closeBtn: true, 
arrows: true, 
nextClick: false, 
helpers: { 
    thumbs: { 
     width: 50, 
     height: 50 
    }, 
    title : { 
     type: 'inside' 
    } 
}, 
beforeLoad: function() { 
    this.title = $(this.element).find('img').attr('alt'); 
} 
}); 

答えて

0
$('.fancybox-thumb').fancybox({ 
prevEffect: 'none', 
nextEffect: 'none', 
closeBtn: true, 
arrows: true, 
nextClick: false, 
helpers: { 
    thumbs: { 
     width: 50, 
     height: 50 
    }, 
    title : { 
     type: 'inside' 
    } 
}, 
beforeLoad: function() { 
    this.title = $(this.element).find('img').attr('alt'); 
} 
}); 
関連する問題