【问题标题】:how to load dynamic images into a slideshow如何将动态图像加载到幻灯片中
【发布时间】:2017-03-23 15:49:21
【问题描述】:

我想创建一个页面,用户可以在其中选择将在幻灯片中显示的图像。我正在尝试使用 imgchecked.js 并想使用 lightgallery.js。

如何将图像数组传递给 dynamicEL? 有没有办法使用 imgchecked 类加载图像?

非常感谢任何帮助。并提前为编码新手道歉。

这是一个 jsfiddle,它似乎只在 chrome 中稍微工作: 带有 lightgallery 的 imgcheckbox - https://jsfiddle.net/ssab/cydgs40n/13/ 谢谢

<div class="slides">
   <ul>
       <li><img src="001.jpg" /></li>
       <li><img src="002.jpg" /></li>
       <li><img src="003.jpg" /></li>
       <li><img src="004.jpg" /></li>
   </ul>
   <button id="dynamic">Launch Gallery</button>
</div>

还有 JS:

$(".slides img").imgCheckbox();

$('#dynamic').on('click', function() {
   $(this).lightGallery({
       dynamic: true,
       dynamicEl: [{ }]
   });
});

【问题讨论】:

  • 感谢您的回答。这正是我想要做的,但图像 src 被写在代码中。如何在不编写特定图像的情况下获取 img src 代码?我希望用户能够单击 1 个或 2 个或 10 个图像,然后启动图库。是否可以通过命名一个类来以某种方式填充画廊,例如“imgchecked”?

标签: javascript jquery checkbox dynamic slideshow


【解决方案1】:

我无法很好地格式化代码,但您可以在此处找到您的解决方案 http://codepen.io/anon/pen/NbGzPM?editors=1111

这个想法是你必须在每次点击动态按钮时准备对象数组并将该数组传递给dynamicEL

注意:请在使用前清理和改进示例代码或让我知道。

【讨论】:

  • 是的!伟大的!非常感谢,这似乎确实有效!
  • 您知道有一种方法可以按点击顺序显示图像吗?我知道在这里问很多!
  • 没问题。如果您想按所选图像排序,则在每次单击图像后,您必须填充我们现在在单击按钮后创建的数组。当您使用处理图像点击事件的 imagecheck 库时;需要破解它,如果他们提供任何 api,那么你可以按照我说的做休息
  • @mero 很高兴您尝试不同的解决方案。让我们打开一个新问题,以便将来观众会得到 2 种不同的解决方案。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-05-01
  • 1970-01-01
  • 2021-04-21
  • 2016-08-15
相关资源
最近更新 更多