javascript - 将内容克隆到 slider

Question

我正在研究响应式设计，并且希望当我的某些内容低于特定大小时将其显示在 slider 中。但是，我想避免渲染数据两次，因此想法是克隆内容并将其附加到 (document).ready() 上的 slider ，然后初始化它。这样，我可以在横向模式下以正常方式显示我的内容，并在纵向模式下以 slider 显示我的内容(从而节省空间)。

var w = $(window).width();

if (w < 769) {

   $("#container").children(".content").each(function () {
      $(this).clone().appendTo("#slider ul").wrap("li");
   });

  initialiseSlider(); // Nothing special about this          
}

内容已克隆到 slider 容器，但由于某种原因，它没有“滑动”。我想这可能是因为 slider 在有任何内容之前就被初始化了，因为如果我对其进行硬编码，它就可以正常工作。那有意义吗？关于如何解决这个问题有什么想法吗？

Answer 1

所以实际上，这可能是一个完全不同的问题，可能与我在页面上有两个相同的 slider 有关。

var w = $(window).width();

   if (w < 769) {

      $('#programmeList').children('article').each(function () {
         var data = $(this).clone().html();
         $('#slider ul').append('<li>' + data + '</li>')
      });
      initialiseSlider();

   }

为什么他们会干扰，我不知道，因为他们有唯一的 ID，并且无论如何都不会同时渲染，而是使用 append() 而不是 appendTo() 有帮助。