jQueryサイクル - 1つのサイクルで2つのアニメーション
-
11-10-2019 - |
質問
私はjQueryサイクルでスライドショーを作りましたが、タイマーに問題があります。カップルサイクルの後、彼らは台無しになります。 1つの関数と1つのタイマーで2つのサイクルアニメーションをマージするにはどうすればよいですか?
助けてくれてありがとう。
xhtml:
<div id="slideshow">
<ul>
<li>
<div class="image"><img src="test.jpg" /></div>
<div class="description">Some text goes here</div>
</li>
<li>
<div class="image"><img src="test.jpg" /></div>
<div class="description">Some text goes here</div>
</li>
<li>
<div class="image"><img src="test.jpg" /></div>
<div class="description">Some text goes here</div>
</li>
</ul>
</div>
jQuery:
var img = $(this).find('#slideshow div.image');
var desc = $(this).find('#slideshow div.description');
$('#slideshow ul').cycle({
fx: 'scrollHorz',
speed: 'fast',
timeout: 5000,
next: '.next',
pause: 1,
slideExpr: img
});
$('#slideshow').cycle({
fx: 'scrollVert',
speed: 'fast',
timeout: 5000,
next: '.next',
pause: 1,
slideExpr: desc
});
解決
私はあなたがすべきだと思います:
- 時間の処理問題のために独自のカスタム関数を作成します(かなり単純なJS関数がトリックを行います)。
- サイクルの「タイムアウト」プロパティを0に設定して、自動回避しないようにします。
- この形式のカスタム関数で、利用可能なコマンド「prev」と「next」を使用します。
$('#slideshow').cycle('next');
私はあなたのコードにアプローチを見ています、あなたがちょうど私に与えた素晴らしいアイデアに感謝しなければなりません。
所属していません StackOverflow