Меню - раздвижное

[sparta]

Встретил вот такую проблему.

Как можно сделать, чтобы после нажатия ссылки "News" - выехала "вертикальная" табличка с новостями. Видимо тут уже javascript нужен?

Если есть у кого пример выполнения такой задачи или "если не сложно кто может продемонстрировать примерчик" прямо тут.

Горит ппц .

<table width="100%">
	<tr>
		<td width="100%">

			<table width="100%">
			<tr>
			<td class="bgcolornews" align="left">
   <img src="img/3star.png" width="9" height="8"><span class="news"><a href="">News</a></span> <-- Клик
			</td>
			</tr>
			</table>


                        <!--  Вот эта -->			

			<table width="100%">
			<tr>
			<td class="date">21.09.2010</td>
			</tr>

			<tr>
			<td class="textinnews" align="left">
		        <span class="linkinnews"><a href="">CS40 Mobile Computer</a></span><br>
			Announcing the launch of Intermec CS40
			</td>
			</tr>

			<tr>
			<td align="right" valign="bottom" width="100%" style="padding-right: 15px;">
			<a href="">more</a>
			</td>
		        </tr>
			</table>
		</td>
	</tr>
</table>

Edited March 3, 2012 by sparta

[Arinden]

Пример.

P.S. не забудьте подключить JQuery.

[ablay2009]

Лучше уж тогда так.

[sparta]

<script type="text/javascript" src="jquery.js">

$(".news").click(function(){
    $(".news_table").slideToggle('1000');
});
?
</script>

Что-то может не так? Скачал библиотеку с http://code.jquery.com/jquery-1.7.1.min.js.

Подключил его и код написал. Но не работает((

<table width="100%">
				<tr>
					<td width="100%">

							<table width="100%">
							<tr>
							<td class="bgcolornews" align="left">
							<img src="img/3star.png" width="9" height="8"><span class="news"><u>News</u></span>
							</td>
							</tr>
							</table>


							<table class="news_table" width="100%" cellspacing="0" cellpadding="0">
							<tr>
							<td class="date" align="left">21.09.2010</td>
							</tr>

							<tr>
							<td align="left">
							<span class="linkinnews"><a href="">CS40 Mobile Computer</a></span><br>
							</td>
							</tr>




							</table>

css подключен

.news_table {
    display: none;
}

Edited March 3, 2012 by sparta

[Arinden]

Я пользуюсь библиотекой google. Вот так:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

И качать ничего не нужно.

Что-то может не так? Скачал библиотеку с http://code.jquery.com/jquery-1.7.1.min.js.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $(".news").click(function(){
        $(".news_table").toggle().slide();
    });
});
</script>

?

Edited March 3, 2012 by Arinden

[sparta]

О) Все - поменял)

Спасибо громадное

Всегда боялся затронуть эту тематику...

Но с Вашей помощью - все получилось)

Громаднейшее спасибо.

Edited March 3, 2012 by sparta