怎么设置图片放大轮播

像下图1一样（这是左右摆放图1，我需要的是上下摆放图2），把图片全放在一个文件夹里面，展示效果是有一列小图在下，然后上面是大图片，小图片轮到哪一个，大图片就放大在上面

image.png图1image.png图2
FineReport 落水 发布于 2023-4-20 11:00 （编辑于 2023-4-20 11:00）
1min目标场景问卷 立即参与
回答问题
悬赏：3 F币 + 添加悬赏
举报
提示：增加悬赏、完善问题、追问等操作，可使您的问题被置顶，并向所有关注者发送通知
共3回答
最佳回答
1
congerLv6高级互助
发布于2023-4-20 11:05（编辑于 2023-4-20 18:24）

引入swiper

动画4.gif

参考文档

https://www.swiper.com.cn/demo/index.html

https://www.swiper.com.cn/demo/300-thumbs-gallery.html

-------------补充模板----------------

模板.zip

引入CSS与js文件

image.png

image.png

将图片放到目录下，或引用url

image.png

单元格写html

image.png

添加js初始化事件

image.png

具体参数参考swiper官网
举报 收起评论(5)
  • 落水 落水(提问者) 啊这，不会啊。这是相当于在外面建好，然后用网页框将连接放进去吗
    2023-04-20 11:11 
  • conger conger 回复 落水(提问者) 参考引入外部文件 https://bbs.fanruan.com/wenda/question/130901.html
    2023-04-20 11:50 
  • 落水 落水(提问者) 回复 conger 还是看不明白，不太清楚什么意思
    2023-04-20 15:17 
  • conger conger 回复 落水(提问者) 已补充模板
    2023-04-20 18:25 
  • 落水 落水(提问者) 回复 conger 哥，能加个联系方式吗
    2023-04-21 10:16 
最佳回答
1
snrtuemcLv8专家互助
发布于2023-4-20 11:01

这个目前标准不支持

有个插件，可以看看

图片轮播-https://help.fanruan.com/finereport/doc-view-4545.html

举报 收起评论(2)
  • 落水 落水(提问者) 这个插件可以实现上面大图轮播，但是不能实现下面小图的轮播
    2023-04-20 11:03 
  • snrtuemc snrtuemc 回复 落水(提问者) 是的，你的需求暂时没有现成方案，这个只是折中方案
    2023-04-20 11:04 
最佳回答
1
CD20160914Lv8专家互助
发布于2023-4-20 11:54

图片放大.rar

填报预览模式下看一下这个文件！！！
举报 收起评论(1)
  • 落水 落水(提问者) 这个不怎么行，决策报表没有填报预览
    2023-04-20 15:16 
  • 3关注人数
  • 400浏览人数
    • 最后回答于：2023-4-20 18:24
    活动推荐 更多
    热门课程 更多
    请选择关闭问题的原因
    确定 取消
    隐私政策
    帆软用户服务协议
    联系管理员
    联系帆软
    Copyright© 帆软软件有限公司 版权所有
    苏ICP备18065767号
    返回顶部