<div id="blindify"> <ul> <li><img src="images/photo_1.jpg" alt=""></li> <li><img src="images/photo_2.jpg" alt=""></li> <li><img src="images/photo_3.jpg" alt=""></li> <li><img src="images/photo_4.jpg" alt=""></li> </ul> </div>
引入jQuery库和blindify相关插件：
![[php框架] Smarty基础商品教程 Smarty入门教程 Smarty框架教程 共10课](https://jy.tp.yuanmeng.life/uploads/images/20210319/f47dc487eb949895833cd962fddc6a8b.jpg)
附件
<link rel="stylesheet" href="css/blindify.min.css">
<script src="js/jquery.min.js"></script>
<script src="js/jquery.blindify.min.js"></script>调用blindify非常简单
$(function(){
$('#blindify').blindify();
});| 参数 | 描述 | 默认值 |
| numberOfBlinds | 百叶窗叶片个数 | 20 |
| slideVisibleTime | 每个幻灯片的停留时间，不包括动画时间，以毫秒为单位 | 2000 |
| color | 幻灯片背景颜色（十六进制颜色） | #000000 |
| margin | 百叶窗之间的距离，以像素（px）为单位。注意：其实是每个百叶窗的边框，所以如果想设置距离为10px，只需设置一半5px | 2 |
| width | 容器的宽度，应与图片的宽度一样，以像素为单位 | 960 |
| height | 容器的高度，应与图片的宽度一样，以像素为单位 | 600 |
| gap | 百叶窗与容器边缘的距离范围，以像素为单位 | 100 |
| animationSpeed | 幻灯片动画过度时间 | 100 |
| delayBetweenSlides | 每个幻灯片切换之间的间隔，以毫秒为单位 | 500 |
| hasLinks | 是否有链接 | false |
| orientation | 百叶窗的方向，可选水平（horizontal）或垂直（vertical），默认为垂直 | vertical |
| startClosed | 百叶窗开始时是否关闭 | false |
| firstOpenDelay | startClosed 为 true 时，百叶窗延迟打开时间，单位为毫秒 | 500 |
*
回帖描述：*
链接类型：*
下载链接：
验证通过自动获取下载链接
*
描述：*
回帖描述：*
链接类型：*
阅读权限：*
下载链接：
微信客服
QQ客服
QQ群
