Здравствуйте форумчане.
Имеется следующая разметка:
<table>
<tr>
<td class="stroka">
<div class="news">Первая новость</div>
<div class="news">Вторая новость</div>
<div class="news">Третья новость</div>
<div class="news">Четвертая новость</div>
<a class="archive" href="#"></a>
</td>
</tr>
<tr>
<td class="stroka">
<div class="news">Первая новость</div>
<div class="news">Вторая новость</div>
<div class="news">Третья новость</div>
<div class="news">Четвертая новость</div>
<a class="archive" href="#"></a>
</td>
</tr>
<tr>
<td class="stroka">
<div class="news">Первая новость</div>
<div class="news">Вторая новость</div>
<div class="news">Третья новость</div>
<div class="news">Четвертая новость</div>
<a class="archive" href="#"></a>
</td>
</tr>
</table>
И код, для сворачивания-разворачивания списка элементов:
<script>
var news = 2; // - количество отображаемых новостей
hidenews = "- скрыть старые новости";
shownews = "+ показать все новости";
$(".stroka").each(function (i) { // - нумерация идентификаторов строк
$(this).prop("id", "news" + i);
});
$(".archive").html( shownews );
$(".news:not(:lt("+news+"))").hide();
$(".archive").click(function (e){
e.preventDefault();
if( $(".news:eq("+news+")").is(":hidden") )
{
$(".news:hidden").show();
$(".archive").html( hidenews );
}
else
{
$(".news:not(:lt("+news+"))").hide();
$(".archive").html( shownews );
}
});
</script>
Все работает, но проблема в том, что таких строк с дивами, у которых одинаковые классы - несколько, потому действие скрипта применяется ко всем строкам сразу.
Я добавил динамическую нумерацию идентификаторов ячеек td, но как теперь реализовать, чтобы сворачивались-разворачивались дивы именно своей ячейки - не знаю.. Возможно я вообще не там копаю. Короче, нуб просит помощи)
