图像预览组件

例子一：

点击列表中的图片，浏览列表中所有图片并默认显示当前图片

		$('img').on('click',function(){
  var list = [],
      index = $(this).index();
  $('img').each(function(inddex,$img){
    list.push({
      thumb: $(this).attr('src'),
      cover: $(this).attr('data-src')
    });
  });
  gallery(list,index);
});
		

例子二

点击弹出

		$('.btnA').on('click',function(){
  gallery([
    {
      thumb: 'images/aboutme_m.jpg',
      cover: 'images/aboutme.jpg'
    },
    {
      thumb: 'images/dragon_m.jpg',
      cover: 'images/dragon.jpg'
    }
  ],0);
});
		

例子三

在图片数目比较多的时候，可以自动适应缩略图位置。

点击弹出

		$('.btnB').on('click',function(){
  gallery([
    {
      cover: 'images/xjkz.png',
      thumb: 'images/xjkz_m.png'
    },
    {
      cover: 'images/aboutme.jpg',
      thumb: 'images/aboutme_m.jpg'
    },
    {
      cover: 'images/dragon.jpg',
      thumb: 'images/dragon_m.jpg'
    },
    {
      cover: 'images/sky.jpg',
      thumb: 'images/sky_m.jpg'
    },
    {
      cover: 'images/spiderman.jpg',
      thumb: 'images/spiderman_m.jpg'
    },
    {cover: 'images/xjkz.png',thumb: 'images/xjkz_m.png'},
    {cover: 'images/aboutme.jpg',thumb: 'images/aboutme_m.jpg'},
    {cover: 'images/dragon.jpg',thumb: 'images/dragon_m.jpg'},
    {cover: 'images/sky.jpg',thumb: 'images/sky_m.jpg'},
    {cover: 'images/spiderman.jpg',thumb: 'images/spiderman_m.jpg'},
    {cover: 'images/xjkz.png',thumb: 'images/xjkz_m.png'},
    {cover: 'images/aboutme.jpg',thumb: 'images/aboutme_m.jpg'},
    {cover: 'images/dragon.jpg',thumb: 'images/dragon_m.jpg'},
    {cover: 'images/sky.jpg',thumb: 'images/sky_m.jpg'},
    {cover: 'images/spiderman.jpg',thumb: 'images/spiderman_m.jpg'},
    {cover: 'images/xjkz.png',thumb: 'images/xjkz_m.png'},
    {cover: 'images/aboutme.jpg',thumb: 'images/aboutme_m.jpg'},
    {cover: 'images/dragon.jpg',thumb: 'images/dragon_m.jpg'},
    {cover: 'images/sky.jpg',thumb: 'images/sky_m.jpg'},
    {cover: 'images/spiderman.jpg',thumb: 'images/spiderman_m.jpg'}
  ],3);
});