anlinmb提供了图片预览函数:anlin.imu({src:'图片地址'}),它支持移动端手势缩放和手指拖拽,同时支持电脑端长按滚轮缩放和长按鼠标拖拽
<img src="/image/1.jpeg" style="width:100px;" onclick="anlin.imu(this)">
<hr>
<button type="button" onclick="anlin.imu({src:'/image/1.jpeg'})">预览图片</button>
点击下方图片和按钮试一试
多图翻页,给img标签添加anlinbs=""属性,它的属性值是代表一组图片的唯一标识
<img anlinbs="111" src="/image/1.jpeg" style="width:100px;" onclick="anlin.imu(this)">
<img anlinbs="111" src="/image/2.jpeg" style="width:100px;" onclick="anlin.imu(this)">
<img anlinbs="111" src="/image/3.jpeg" style="width:100px;" onclick="anlin.imu(this)">
<!--另一组图片-->
<img anlinbs="222" src="/image/4.jpeg" style="width:100px;" onclick="anlin.imu(this)">
<img anlinbs="222" src="/image/5.jpeg" style="width:100px;" onclick="anlin.imu(this)">
<img anlinbs="222" src="/image/6.jpeg" style="width:100px;" onclick="anlin.imu(this)">
点击下方图片试一试
另一组图片
anlin.imu(参数1,参数2)它有第二个参数:['图片地址1','图片地址2'...],代表预览的一组图片,当参数1的图片地址不在参数2数组中时将添加到第一张显示,反之根据参数2的位置显示
<button type="button" onclick="anlin.imu({src:'/image/1.jpeg'},['/image/6.jpeg','/image/4.jpeg'])">预览图片</button>
<!--示例二-->
<button type="button" onclick="anlin.imu({src:'/image/1.jpeg'},['/image/6.jpeg','/image/1.jpeg','/image/4.jpeg'])">预览图片示例二</button>
点击下方按钮试一试
示例2
动态加载js文件:anlin.js(['文件路径1','文件路径2'...],function(){...所有js请求完成后运行函数});,该函数支持跨域请求,js文件中包含错误的代码将无法运行,基于插件和框架的js文件必须优先加载,优先级从左到右:[1,2,3...]
<script>
anlin.js(['https://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js'],function(){alert('加载完成');});
</script>