单击按钮时显示加载动画预加载条
单击按钮时显示加载动画预加载条
提问于 2019-08-05 07:12:04
我已经使用类似的代码在我的按钮上显示了一个不确定的进度条，但现在我只是想让预加载条出现，但在单击之前它们应该是不可见的。我想要在单击按钮时触发动画，以打开图库或隐藏加载动画，直到单击发生为止。
图片库可能需要2-10秒的加载时间，因此此按钮动画将一直播放到新页面加载。
我认为这可能是元素的名称，因为我已经将几段代码放在一起(最初是基于ladda的预加载器示例)，并且这些栏是新的。我希望在单击之前隐藏条的数据加载不起作用。
感谢您的任何建议或建议！
.button[data-loading]Codepen：https://codepen.io/admecoach/pen/NQwrOg
目标是单击大按钮，然后在文本右侧开始播放条形图动画，直到加载新页面。并在appx 10秒内重置所有(没有可见的颜色进度条)，以防页面未加载，需要再次单击按钮。
回答 1
Stack Overflow用户
发布于 2019-08-05 12:57:18
在其父<a>之外有一个结束<span>标记，并且JS脚本重复两次。document.querySelectorAll()正在寻找一个类为.button的元素，但您的元素中包含类为.ladda-button的元素。默认情况下，.loading跨度应该是隐藏的，并且您需要一个CSS选择器[data-loading]来显示.loading元素。请参阅下面的链接，链接到更新后的codepen，它可以正常工作。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/57350799
复制相关文章
相似问题
腾讯云开发者
