HTML图片浏览效果如何修改？

浏览效果：http://jsrun.net/M6vKp/edit

学习作业，代码与效果可直接点击上面的链接，我根据找到的插件修改了自己的其中模块，点击图片会出现弹窗，弹窗会获取当前页面的图片，然后可以进行切换和全屏显示。

因为只用写前端，不用数据库，所以我在照片文件夹下另建了一个文件夹，点击图片后出现弹窗，弹窗获取这个文件夹里面的图片，而不是获取页面上所有的图片，请问大佬们，该如何修改成获取这个本地文件夹里面的图片？

回答

你现在是通过jq查询到所有img标签的src然后push进imagesArr中，如果你要展示本地的图片列表，你自己写死imagesArr然后数组每项对应本地图片的相对路径即可。如果要动态获取可能需要用到node中的fs模块进行文件读取，fs.readFile(filename,[options],callback)

// 先分析引用路径
// 从这里看本地路径是：../photo/image/*.png
<script src="https://segmentfault.com/js/pic_view.js"></script>
// 然后分析函数引用
$.pic_view({
    images: imagesArr,                  //需要查看的图片，数据类型为数组
    initImageIndex: this_.index() + 1,  //初始查看第几张图片，默认1
    scrollSwitch: true                  //是否使用鼠标滚轮切换图片，默认false
});
// 很明显你需要的是 imagesArr，逆推数据源是 图片的 src 属性 = 图片路径
建议整个全局的常数写图片路径，然后替换 imagesArr，可以写多一点，然后 .slice(0, imagesArr.length)

以上是 HTML图片浏览效果如何修改？ 的全部内容， 来源链接： utcz.com/a/26101.html

回到顶部