PDA

Просмотр полной версии : Разворачивающееся меню для сайта.


MafiaBoy3
09.07.2008, 11:39
Собственно не знаю как сделать. А поэтому интересуют все статьи где детально и с картинками описывается РАЗВОРАЧИВАЮЩЕЕСЯ МЕНЮ.

Статьи можно на английском, лижбы было понятно.

Ps:Гуглил по миру но гугл выдавал гавённые статьи, где чисто текст (и то корявый).

Корвин
09.07.2008, 11:52
смари тебе нада див спозиционированный определенно со style="display:none" и id="asd"

и в том месте при наведении на которое менюшка должна появляца

onmouseover="document.getElementById('asd').style.display='bloc k';"
и onmouseout="document.getElementById('asd').style.display='none ';"

получается читать тебе нада про обработчики событий типа onmouseover и про document.getElementById , вот и все, сперва попробуй попрактиковаца с тем что я написал, сделай див с такими параметрами и любой обьект на который можно мышку навести

-=Static=-
09.07.2008, 11:57
Собственно не знаю как сделать. А поэтому интересуют все статьи где детально и с картинками описывается РАЗВОРАЧИВАЮЩЕЕСЯ МЕНЮ.

Статьи можно на английском, лижбы было понятно.

Ps:Гуглил по миру но гугл выдавал гавённые статьи, где чисто текст (и то корявый).

начни свои поиски отсюда:
http://habrahabr.ru/tag/JavaScript/
http://habrahabr.ru/tag/css/

http://www.rsdn.ru/Forum/?mid=177943 (конкретно про меню)
http://www.rsdn.ru/article/inet/jQuery.xml (про отличный фреймворк)

Корвин
09.07.2008, 12:08
начни свои поиски отсюда:
http://habrahabr.ru/tag/JavaScript/
http://habrahabr.ru/tag/css/

http://www.rsdn.ru/Forum/?mid=177943 (конкретно про меню)
http://www.rsdn.ru/article/inet/jQuery.xml (про отличный фреймворк)


я пытаюсь научить человека искать инфу правильно в нете, такое не трудно найти, просто нада знать что искать

Jer1cho
09.07.2008, 12:28
Простой пример:

<html>
<head>
<title>Test</title>
<style type="text/css">
.mn {
border-bottom:#B6BCC6 1px solid;
border-top:#B6BCC6 1px solid;
}

.sm {
visibility:hidden;
position:absolute;
border-left:2px #B6BCC6 solid;
border-right:2px #B6BCC6 solid;
border-bottom:2px #B6BCC6 solid;
background-color:#F5F5F5;
}
</style>

<script type="text/javascript">
var oldId;
function omo(ml,m){ ex(ml); oldId = ml; }
function hi(elem) { document.getElementById(elem).style.visibility = 'hidden'; }
function ex(elem) { document.getElementById(elem).style.visibility = 'visible'; }
</script>
</head>
<body bgcolor="#E8EAEF">
<table width='750' cellpadding='0' cellspacing='0' border='0' align='center'>
<tr>
<td class='mn' width='20'></td><td class='mn' id='m1' onMouseOver="omo('ml1','m1')" onMouseOut="hi('ml1')"><a href='/video' class='menu' onClick='return false;'>Video</a></td>
<td class='mn' width='20'></td><td class='mn' id='m2' onMouseOver="omo('ml2','m2')" onMouseOut="hi('ml2')"><a href='/foto' class='menu' onClick='return false;'>Foto</a></td>
<td class='mn' width='20'></td><td class='mn' id='m3' onMouseOver="omo('ml3','m3')" onMouseOut="hi('ml3')"><a href='/music' class='menu' onClick='return false;'>Music</a></td>
</tr>
<tr>
<td></td><td><div id='ml1' onMouseOver="ex('ml1')" onMouseOut="hi('ml1')" class='sm'>
<nobr>
<a href='#'>dasasdasas</a><br>
<a href='#'>dasdasdasdasdasdas</a><br>
<a href='#'>dsadasdadsadsadasdas</a><br>
<a href='#'>dsadsasadasdasdasas</a><br>
<a href='#'>dsaaddasdasasdasds</a><br>
</nobr>
</div></td>

<td></td><td><div id='ml2' onMouseOver="ex('ml2')" onMouseOut="hi('ml2')" class='sm'>
<nobr>
<a href='#'>dasasdasas</a><br>
<a href='#'>dasdasdasdasdasdas</a><br>
<a href='#'>dsadasdadsadsadasdas</a><br>
<a href='#'>dsadsasadasdasdasas</a><br>
<a href='#'>dsaaddasdasasdasds</a><br>
</nobr>
</div></td>

<td></td><td><div id='ml3' onMouseOver="ex('ml3')" onMouseOut="hi('ml3')" class='sm'>
<nobr>
<a href='#'>dasasdasas</a><br>
<a href='#'>dasdasdasdasdasdas</a><br>
<a href='#'>dsadasdadsadsadasdas</a><br>
<a href='#'>dsadsasadasdasdasas</a><br>
<a href='#'>dsaaddasdasasdasds</a><br>
</nobr>
</div></td>
</tr>
</table>
</body>
</html>

Примерно как-то так.
А вообще можешь поразбирать код на сайтах, где есть меню, если что-то не поймешь...

-=Static=-
09.07.2008, 12:48
я пытаюсь научить человека искать инфу правильно в нете, такое не трудно найти, просто нада знать что искать

Это надо не инфу искать, а брать учебник для начинающих и потихоньку, шаг за шагом учить язык. Я дал ссылки на те места где, по моему мнению, можно прочесть оч хорошие маны.

MafiaBoy3
09.07.2008, 13:08
нифига не нашёл

Корвин
09.07.2008, 14:04
хахаха, да тебе тут стока понаписали, на 10 менюшек хватит, и ты ничо не нашол?

MafiaBoy3
09.07.2008, 15:14
Вот всё таки нашел, но и Вам спасибо!

http://anton.shevchuk.name/javascript/jquery-for-beginners/

Отличная стать по JQuery с картинками и примерами онлайн.