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
}
4

1 に答える 1