$ .cycle и динамический контент после события клика

StackOverflow https://stackoverflow.com/questions/2361043

  •  23-09-2019
  •  | 
  •  

Вопрос

Я хочу применить цикл к блоку DIV с динамическим содержанием. Этот контент будет генерироваться после события Click. Как только я нажимаю на изображение, он работает после этого не работает.

Код:

$("div.cls img").click(function() {

  ....  Adding the content


 $('#myDiv').cycle({
            fx: 'scrollHorz',
            speed: 3500,
            timeout: 0, continuous: true,
            pause: 1, sync: 1
        }); 
}); 

HTML:

<div id="myDiv">
 <div>
 <a id="i1"> abc</a>
 <a id="i2"> abcd</a>
 <a id="i3"> abce</a>
   <a id="i4"> abcf</a>
 <a id="i5"> abcg</a>
 <a id="i6"> abch</a>
</div>
 <div>
 <a id="i11"> abc1</a>
 <a id="i21"> abcd1</a>
 <a id="i31"> abce1</a>
   <a id="i41"> abc1f</a>
 <a id="i51"> abcg1</a>
 <a id="i61"> abch1</a>
</div>
</div>
Это было полезно?

Решение

РЕДАКТИРОВАТЬ:

Попробуйте позвонить $.cycle() снова после добавления вашего динамического контента. Кроме того, используйте Firebug, чтобы убедиться, что ваш контент генерируется правильно.

Если это не сработает, то, похоже, вам придется изменить плагин Cycle, чтобы поддержать динамическое добавление «слайдов» или написать свое собственное решение.


Из http://www.malsup.com/jquery/cycle/:

Как это работает

Плагин предоставляет метод, называемый циклом, который вызывается на элементе контейнера. Каждый дочерний элемент контейнера становится «слайдом». Параметры контролируют, как и когда слайды переходят.

Итак, вы можете оставить свой JavaScript в покое, но HTML должен выглядеть так:

<div id="myDiv">
  <div>
    <a id="i1"> abc</a>
    <a id="i2"> abcd</a>
    <a id="i3"> abce</a>
    <a id="i4"> abcf</a>
    <a id="i5"> abcg</a>
    <a id="i6"> abch</a>
  </div>
  <div>
    <a id="i11"> abc1</a>
    <a id="i21"> abcd1</a>
    <a id="i31"> abce1</a>
    <a id="i41"> abc1f</a>
    <a id="i51"> abcg1</a>
    <a id="i61"> abch1</a>
  </div>
</div>

Кроме того, у вас никогда не должно быть более одного элемента на странице с тем же идентификатором.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top