效果图:
前些日子见到了这种效果图,本来想着用js敲可是估计又要废掉大半天,再加上时间紧而且没必要,就看了看现成的轮子。然而网上的轮子貌似都是jquery插件,无奈,突然想起Swiper貌似也能做,于是就弄出来了这些东西。
Swiper插件非常强大,真心佩服。由于通常网页中至少一个轮播图,所以这里会遇到如何如何在网页中插入两个Swiper且不产生冲突,解决方法在这里:click here~。
html:
<!DOCTYPE html>
<html>
<head>
<title>滑动型产品展示图</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="./swiper.min.css">
<link rel="stylesheet" type="text/css" href="./test18.css">
<script src="./swiper.min.js"><