jQueryサイクルプラグインを使用してスライドショーを作成しようとしています。
スライドショーにはコンテンツがあり、コンテンツの中には基本的な画像ギャラリーがあります。
画像ギャラリーが使用するサイクルのタイムアウトは、コンテンツのタイムアウトよりも短くなります。したがって、コンテンツは15秒間待機し、画像ギャラリーには3秒のタイムアウトで5枚の写真が表示され、15秒後にコンテンツが変更されます。
すべて問題ないように聞こえますが、ページを実行すると、コンテンツと最初の画像ギャラリーが循環します。ただし、2番目のコンテンツにジャンプするときは、画像ギャラリーを循環しません。
このコードブロックを画像ギャラリーリピーターの上に配置しようとしました$('#cycleImages').cycle({...
が、うまくいきませんでした。
これらのネストされたサイクルをどのように連携させることができますか?ありがとうございました
<head runat="server">
<script type="text/javascript" src="/Js/jquery-1.2.6.js"></script>
<script src="/Js/jquery.cycle.all.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#cycleContent').cycle({
fx: 'scrollRight',
delay: -1000,
timeout: 15000
});
});
$('#cycleImages').cycle({
fx: 'fade',
speed: 500,
timeout: 3000,
pause: 1
});
</script>
</head>
そしてこれは私のhtmlマークアップです
<div id="cycleContent">
<asp:Repeater ID="rptContent" runat="server">
<ItemTemplate>
<div>
<h2 class="slideShow-type">("Type.Name") %></h2>
<h2 class="slideShow-title">("Title") %></h2>
<div id="cycleImages">
<asp:Repeater ID="rptBigPictures" DataSource='<%#Eval("Images") %>' EnableViewState="false"
runat="server">
<ItemTemplate>
<asp:Image ID="imgProfile" runat="server" ImageUrl='<%#Eval("Path") + ".jpg" %>' />
</ItemTemplate>
</asp:Repeater>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
</div>