Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   меню в стиле аккордеон из таблицы (https://javascript.ru/forum/dom-window/23084-menyu-v-stile-akkordeon-iz-tablicy.html)

chdn 10.11.2011 21:12

меню в стиле аккордеон из таблицы
 
на сайте реализовано меню следующим образом
<table id="Left_menu" class="LeftList" cellpadding="0" border="1">
	<tr>
		<th title="">
			<e01>меню 1
		</th>
	</tr>
	<tr class="LeftList1">
		<td>
			<a title="" href="">подменю 1</a>
		</td>
	</tr>
	<tr class="LeftList">
		<td>
			<a title="" href="">подменю 2</a>
		</td>
	</tr>
	<tr class="LeftList1">
		<td>
			<a title="" href="">подменю 3</a>
		</td>
	</tr>
	<tr class="LeftList">
		<td>
			<a title="" href="">подменю 4</a>
		</td>
	</tr>
	<tr>
		<th title="">
			<e03>меню 2
		</th>
	</tr>
	<tr class="LeftList1">
		<td>
			<a title="" href="">подменю 1</a>
		</td>
	</tr>
	<tr class="LeftList">
		<td>
			<a title="" href="">подменю 2</a>
		</td>
	</tr>
	<tr class="LeftList1">
		<td>
			<a title="" href="">подменю 3</a>
		</td>
	</tr>
	<tr class="LeftList">

		<td>
			<a title="" href="">подменю 4</a>
		</td>
	</tr>
</table>


хочется из этого сделать меню в стиле аккордеон.

В инете есть много готовых скриптов, но они заточены под теги <ul> <li>,
а структуру и теги меню я изменить не могу.
Попытался написать скрипт который задает пунктам меню id,
вот скрипт

window.onload = (function idTable() {
var table=document.getElementById("ctl00_LeftContent_ListLeft1_TList")
var thh = document.getElementById('ctl00_LeftContent_ListLeft1_TList').getElementsByTagName('th');
var tdd = document.getElementById('ctl00_LeftContent_ListLeft1_TList').getElementsByTagName('td');
for (r=0; r<table.rows.length; r++)
{
	if (table[r]=thh[r])
		{
			table[r].parentNode.id += ('menu'+r);
		}
}
for (i=0; i<table.rows.length; i++)
{
	if  (table[i]=tdd[i])
	{
		table[i].parentNode.id += ('submenu'+i);
	}
	
}
});

вот что получилось
<tbody>
<tr id="menu0">
<tr id="submenu0" class="LeftList1">
<tr id="submenu1" class="LeftList">
<tr id="submenu2" class="LeftList1">
<tr id="submenu3" class="LeftList">
<tr id="menu1">
<tr id="submenu4" class="LeftList1">
<tr id="submenu5" class="LeftList">
<tr id="submenu6" class="LeftList1">
<tr id="submenu7" class="LeftList">
</tbody>


Хотел присвоить первому пунку меню (th) id="menu0" подпунктам (td) id="submenu0", второму id="menu1" подпунктам id="submenu1" и т.д.

Помогите написать скрипт, если вообще возможно реализовать сворачивающееся меню из таблицы.

P.S. На сайте меню длиной на три высоты экрана смотрится не очень:)
В javascripte новичок.

ksa 10.11.2011 21:15

Цитата:

Сообщение от chdn
Помогите написать скрипт

Сколько платишь?


Часовой пояс GMT +3, время: 23:45.