两个slick幻灯模块相互关联效果

效果截图

参考代码

<div class="slider slider-for">
	<div>
		<h3>1</h3>
	</div>
	<div>
		<h3>2</h3>
	</div>
	<div>
		<h3>3</h3>
	</div>
	<div>
		<h3>4</h3>
	</div>
	<div>
		<h3>5</h3>
	</div>
</div>
<div class="slider slider-nav">
	<div>
		<h3>1</h3>
	</div>
	<div>
		<h3>2</h3>
	</div>
	<div>
		<h3>3</h3>
	</div>
	<div>
		<h3>4</h3>
	</div>
	<div>
		<h3>5</h3>
	</div>
</div>
<script>
$('.slider-for').slick({
	slidesToShow: 1,
	slidesToScroll: 1,
	arrows: false,
	fade: true,
	asNavFor: '.slider-nav'
});
$('.slider-nav').slick({
	slidesToShow: 3,
	slidesToScroll: 1,
	asNavFor: '.slider-for',
	dots: true,
	centerMode: true,
	focusOnSelect: true
});
</script>

专注中小企业网站建设，网站安全15年，熟悉各种CMS建站系统，善于解决各种网站疑难杂症。

承接PHP仿站，网站模板制作，网站修改，网站改版，二次开发，网站安全，服务器安全，网站被黑修复，网站漏洞修复等......

有需要请联系下方微信，解决问题仅需 ￥10 元起！