懒人之家--可能是JS网页特效代码收集最全的懒站!

jQuery幻灯片图片切换插件Slippry

作者/代码整理:  (转载请附加本文地址,带有“懒人原生”字样的谢绝转载) 发布日期:2017-08-09
一款基于Slippry.js插件实现的带左右箭头按钮控制与缩略图的图片切换特效,jQuery幻灯片切换代码。


js代码

<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>
<script src="js/slippry.min.js"></script>
<script>
	var thumbs = jQuery('#thumbnails').slippry({
	  // general elements & wrapper
	  slippryWrapper: '<div class="slippry_box thumbnails" />',
	  // options
	  transition: 'horizontal',
	  pager: false,
	  auto: false,
	  onSlideBefore: function (el, index_old, index_new) {
		jQuery('.thumbs a img').removeClass('active');
		jQuery('img', jQuery('.thumbs a')[index_new]).addClass('active');
	  }
	});

	jQuery('.thumbs a').click(function () {
	  thumbs.goToSlide($(this).data('slide'));
	  return false;
	});
</script>