Как потушить изображения и текст (здесь текст связан с конкретным изображением) за один раз, используя плагин цикла jQuery?

Question

Как потушить изображения и текст (здесь текст связан с конкретным изображением) за один раз, используя плагин цикла jQuery?

0

Как затухать изображения и текст (здесь текст связан с конкретным изображением) одновременно с использованием плагина цикла jQuery?

<div>
<div id= "box-slider" class=" blueboxcontent " >
        <ul>
          <li>
          <div class="img-wrapper">
            <img src="news_instyle_c2p.jpg" />
          </div>
          <div class="text-warpper">
            <p>Some text here for image 1</p>
          </div>
    </li>

    <li>
      <div class="img-wrapper">
            <img src="news_instyle3D.jpg"/>
      </div>
      <div class="text-warpper" >
            <p>Some text here for image 2</p>
      </div>
    </li>

    <li>
      <div class="img-wrapper">
            <img src="news_instyle.jpg"/>
      </div>
      <div class="text-warpper">
           <p>Some text here  for image 3 < /p>
      </div>
    </li>
  </ul>
  </div>

Сценарий:

$( '#box-slider' ).cycle( { 
    fx:    'fade', 
    speed:  700,
    timeout:  2000
 });

CSS:

*{ margin:0; padding:0; }

box-slider{
  width:250px;
  float:left;
  overflow:hidden;
}

box-slider ul li {
  list-style:none;
  float:left;
  height:102px;
  width: 396px;
}

box-slider ul li . img-wrapper {
  width:132px;
  float:left
}

box-slider ul li .text-warpper {
width:264px;
float:left
}

Rajesh Bala 23 сен. 2013, в 12:47

Источник

Теги:

jquery

jquery-cycle

1 ответ

Ещё вопросы

Bruno · Answer 1 · 2014-05-03T23-29-00.000Z

Ваша проблема заключается в том, что у вас есть только один слайд, так как цикл применяется к div, и у вас есть только один. Поскольку цикл применял прямой дочерний элемент ниже в структуре dom. Ваш селектор должен указывать на тег. Поскольку он не идентифицирован, используйте приведенный ниже выбор, чтобы дать ему класс или идентификатор и выбрать его напрямую

Простым решением было бы изменить ваш селектор.

$( '#box-slider ul' ).cycle( { 
  fx:    'fade', 
  speed:  700,
  timeout:  2000
});