amazeui gallery预览大图交互效果(pureview)失效

发布于 2022-09-04 18:59:24 字数 766 浏览 18 评论 0

使用amazeui gallery实现图片缩略图及大图预览,
问题: 有的情况下(如:rails项目erb模板渲染),查看大图时是通过备用的a标签,而不是amazeui gallery的效果

问题重现: 项目代码

示例中下面一排图片,查看大图一直是通过a标签的方式,而不是amazeui写的purview的效果,而审查元素可以看到其html代码是生成了的;我把代码搬到CodePen上,结果是都能正常使用预览大图的交互,不知原因是什么,怎么解决?
CodePen Demo代码
CodePen Demo效果: Debug Mode

按照amazeui官网的介绍,应该是在没有Javascript的情况下,才会用a标签的方式查看大图,上面所列示例,代码是一样的,然而一个效果正常,一个则一直是通过a标签查看,不知是什么原因,怎么解决,知道的朋友麻烦告知一下!

原问题链接

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

ㄖ落Θ余辉 2022-09-11 18:59:24

在问题重现的项目里,将amazeui.gallery代码放到最后加载,发现效果就正常了,可查看项目代码
猜测原因:图片的数据由js或html模板(如rails erb, laravel blade)渲染的话,需要保证等到数据渲染完毕后,再运行gallery的代码,这样其事件才正常绑定;
由于gallery执行时不需要执行某一句js代码,没有办法通过调整该代码何时执行来达到目标,不知道有没有能不能将查看大图这个功能给暴露出来,需要时再执行。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文