<p>
<p class="connected-carousels">
<p class="stage">
<p class="carousel carousel-stage">
<ul>
<li><img src="themes/68ecshopcom_360buy/designer/img/img1.jpg" width="800" height="400" alt=""></li>
<li><img src="themes/68ecshopcom_360buy/designer/img/img2.jpg" width="800" height="400" alt=""></li>
<li><img src="themes/68ecshopcom_360buy/designer/img/img3.jpg" width="800" height="400" alt=""></li>
<li><img src="themes/68ecshopcom_360buy/designer/img/img4.jpg" width="800" height="400" alt=""></li>
</ul>
</p>
<a href="javascript:void(0)" class="prev prev-stage"><span>‹</span></a>
<a href="javascript:void(0)" class="next next-stage"><span>›</span></a>
</p>
<p class="pic-nav" style="width:100%;margin: 5px auto 0 auto; ">
<p class="title">效果图:</p>
<p class="canshu xuan"><a href="javascript:void(0)">全部(4) </a></p>
<p class="canshu"><a href="javascript:void(0)" id="">客厅(2) </a></p>
<p class="canshu"><a href="javascript:void(0)" id="">卧室(1) </a></p>
<p class="canshu"><a href="javascript:void(0)" id="">平面图(1) </a></p>
<p class="canshu"><a href="javascript:void(0)" id="">俯视图(1) </a></p>
</p>
<p class="navigation">
<a href="javascript:void(0)" class="prev prev-navigation">‹</a>
<a href="javascript:void(0)" class="next next-navigation">›</a>
<p class="carousel carousel-navigation">
<ul>
<li><img src="themes/68ecshopcom_360buy/designer/img/img1_thumb.jpg" width="50" height="50" alt="客厅"></li>
<li><img src="themes/68ecshopcom_360buy/designer/img/img2_thumb.jpg" width="50" height="50" alt="卧室"></li>
<li><img src="themes/68ecshopcom_360buy/designer/img/img3_thumb.jpg" width="50" height="50" alt="平面图"></li>
<li><img src="themes/68ecshopcom_360buy/designer/img/img4_thumb.jpg" width="50" height="50" alt="俯视图"></li>
</ul>
</p>
</p>
</p>
</p>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
你这个可以理解为,有多个轮播图。也可以理解为,动态替换轮播图图片,动态计算。一般轮播图都已经实现了这样的效果。只不过需要你自己写事件替换其中的图片