Рассмотрим таблицу типа
<div class='Textslideshow'>
<table width='600px' style='padding-left:0%;' border='1'>
<tr>
<td width='100%' align='center' valign='middle' style="font-family: Arial">Header1</td>
<tr>
<td width='100%' align='center' valign='middle' style="font-family:Arial">
<table border='1' cellpadding='3' cellspacing='7'>
<tr>
<td width='50%' align='center'>Time1</td>
<td width='50%' align='center'>Label1</td>
</tr>
<tr>
<td width='50%' align='center'>Time2</td>
<td width='50%' align='center'>Label2</td>
</tr>
</table>
</td>
</tr>
</tr>
</table>
<table width='600px' style='padding-left:0%;' border='1'>
<tr>
<td width='100%' align='center' valign='middle' style="font-family: Arial">Header2</td>
<tr>
<td width='100%' align='center' valign='middle' style="font-family:Arial">
<table border='1' cellpadding='3' cellspacing='7'>
<tr>
<td width='50%' align='center'>Time1</td>
<td width='50%' align='center'>Label1</td>
</tr>
<tr>
<td width='50%' align='center'>Time2</td>
<td width='50%' align='center'>Label2</td>
</tr>
</table>
</td>
</tr>
</tr>
</table>
Под этим div, имея несколько таблиц, подобных этому, я просматриваю каждую таблицу, используя цикл JQuery с определенной скоростью 5 секунд. Теперь html-страница может отображать только 10 записей Time и Label. Если есть более 10 записей, мне нужно разделить время на 2,5 секунды для 1-10 и 10+ за другие 2,5 секунды. Остальные таблицы должны отображаться обычно в течение 5 секунд. Соответствующий JQuery - это то, где textpeed - 5000.
$(window).load(function () {
$('.Textslideshow').cycle({
fx: textTransitionEffect,
speed: textSpeed,
timeout: textTimeout
});
});
Этот код работает для таблиц с записями от 1 до 10 (Time & Label). Если у вас больше записей, записи добавляются в таблицу. Но мне нужно разбить таблицу (с записями более 10) и показать ее по 2,5 секунды. jsFiddle link jsFiddle
Любые предложения для этого.
Я сделал эту работу, используя следующий код
$('#MovieDisplayTiming').append(opthtml);
$('#MovieDisplayTiming div').css('width', $('#MovieDisplayTiming').width());
$('#MovieDisplayTiming').cycle({
fx: 'fade',
after: function () { $('.fillingfast').blink(1000); },
speed: 2000,
timeout: 8000,
before: function (curElement, nextElement, options, forwardFlag) {
if ($('.DisplayIndividualTiming').length !== 0) {
$('.DisplayIndividualTiming').cycle({
fx: 'scrollUp',
speed: 'slow',
timeout: 4000,
autostop: true
});
}
}
});