Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Общие вопросы > DHTML MENU


Автор: IZ@TOP 17.4.2003, 12:51
Как сделать DHTML MENU как http://microsoft.com с левой стороны !???

Автор: Gannibal 17.4.2003, 13:05
умееш ли CSS тогда без проблем могу сразу написать код небольшож только скажи буду ждат smile.gif

Автор: IZ@TOP 17.4.2003, 14:12
css энто запросто ! Давай пиши ! (желательно с комментариями - что где когда и для чего ... если моно)

Автор: Gannibal 17.4.2003, 14:46
okei tak ze budu pisat' kak stranichku okei...... *4*
Код

<html>
<head>
<title>menu</title>
</head>
<style>    
.mar {  
   margin-bottom : 3;    // eto ia tak koroche tebe v moposch soobschenia siuda napishu
   margin-left : 3;          // tak ze v etich chetyrioch strokach opisan otstup ot krajov
   margin-right : 3;       // esli bottom tak eto ot niza otstup top svercha left s leva a right s prava
   margin-top : 3;         // nadejus' poniatno vsio
}

a.m {
   height:20;                            // vot etot klass napisan tol'ko dli ssylok i kogda v sylkach budet pripsano
   color: black;                         // class=m, zdes heigh 20 vysota stolbika mozhno miniat. color poniatno cvet
   text-decoration: none;        // text-decoration: none eto shto ssylka nebudet podchorknuta esli postavit
   font-family : "Arial Black";    // underline znachit podchorknuto, font-family nadejus' poniatno.... tip shrifta
}

a.m:hover {                            // zdes eto deistviet budet proishodit kogda navidiosh na ssylku kursorom
   width:149px;                      // poniatno shirina,  
   TEXT-DECORATION: none;
   background-color: silver;    // zdes' eto dlia togo shotby na zadnem fone pod ssylkoi nahodilsia drugoi cvet
   border:1px solid gray;        // a eto ramochka prosto vokrug ssylki obychnaja linia v 1px, mozhno postavit
}                                             // naprimer dashed shtoby strihputirnia byla

table, tr, td {                          // a eto prosto svoistva dlia tablic shto tam budet tipa shrift 11px
   font-size:11px;                   // vysota linii 19px  
   line-height: 19px;               // i cvet na chernyi
   color: black;                        
}
</style>
<body scroll=auto>
<table border=0 cellpadding=0 cellspacing=0 width=150 style="background-color:#CDCDCD;">
<Tr>
 <td>
<a href="#" class=m><div class=mar>Programirovanie</div></a>
<a href="#" class=m><div class=mar>Programirovanie</div></a>
<a href="#" class=m><div class=mar>Programirovanie</div></a>
<a href="#" class=m><div class=mar>Programirovanie</div></a>
<a href="#" class=m><div class=mar>Programirovanie</div></a>
<a href="#" class=m><div class=mar>Programirovanie</div></a>
<a href="#" class=m><div class=mar>Programirovanie</div></a>
<a href="#" class=m><div class=mar>Programirovanie</div></a>
<a href="#" class=m><div class=mar>Programirovanie</div></a>
</td>
</tr>
</table>


pohoze shtoto vrode kak u microsofta kak ty hotel ili net? ia uje v tom sam zaputalsia

Автор: IZ@TOP 17.4.2003, 14:59
А где код который подменю открывает ?

Автор: IZ@TOP 17.4.2003, 15:01
Че то не то получилось ...

Автор: Gannibal 17.4.2003, 15:02
ты есчо под мену хочеш ну тогда жди иду дописовать извини незнал што есчо хочеш подмену....

Автор: IZ@TOP 17.4.2003, 15:43
М.Е.Г.У.С угу очень хочу !

Автор: Gannibal 17.4.2003, 15:56
слушаи незнаю неполучается у меня мену......... такоэ как на там так што я тебе ссылочку дам

http://www.softlinks.ru/post.php?url=/download/script.php&scriptID=111&key=1050583924

Автор: Gannibal 17.4.2003, 15:59
надо будеет помудрить а то как то плахавато меню то у меня шло ://

Автор: IZ@TOP 18.4.2003, 08:29
балин я хочу понять каким методом рисуются таблицы , и не портят обстановки ! (чтоб они то появлялись то исчезали - надо я так понимаю пользоваться свойством style.visibility="hidden"; и наооборот ?!!!)

Автор: Gannibal 18.4.2003, 08:56
доброэ утро, так же есть возможность с помосчю ЦСС писать block: display; visibillity: hidden; а потом с помосчю скрипта onmouseover='style.class('menu'); помоиуму так как то... smile.gif)

Автор: IZ@TOP 18.4.2003, 09:36
Цитата
block: display; visibillity: hidden;

А вот это по конкретнее можно ?!
Как это в коде выглядит ?
Я чет подзабыл как в жава скрипт классы создавать ...

Автор: Gannibal 18.4.2003, 09:53
net eto normal'no v CSS propisyvajesh naprimer

m {
height:20; // vot etot klass napisan tol'ko dli ssylok i kogda v sylkach budet pripsano
color: black; // class=m, zdes heigh 20 vysota stolbika mozhno miniat. color poniatno cvet
text-decoration: none; // text-decoration: none eto shto ssylka nebudet podchorknuta esli postavit
font-family : "Arial Black"; // underline znachit podchorknuto, font-family nadejus' poniatno.... tip shrifta
width:150px;
block: none;
visibillity: hidden;
}

mh { // zdes eto deistviet budet proishodit kogda navidiosh na ssylku kursorom
width:149px; // poniatno shirina,
TEXT-DECORATION: none;
background-color: silver; // zdes' eto dlia togo shotby na zadnem fone pod ssylkoi nahodilsia drugoi cvet
border:1px solid gray; // a eto ramochka prosto vokrug ssylki obychnaja linia v 1px, mozhno postavit
block:display;
visibillity: visible;
}

a potom propisyvajesh sysylku kak

<a href="#" onmouseover="style.class('mh');" onmouseout="style.class('m');" style="block; ne;">proba</a>

vot blin sam uzhe neznaju pozabyl podozhdi pokopajus' na kompe.....

Автор: IZ@TOP 18.4.2003, 10:25
Цитата
<a href="#" onmouseover="style.class('mh');" onmouseout="style.class('m');" style="block; ne;">proba</a>


А ... понял ...
А как универсальный конструктор сделать ?

Автор: Gannibal 18.4.2003, 10:30
confused.gifconfused.gif tounge.gif

Автор: Guest_DeathStorm 18.4.2003, 11:32
так пару советов по твоей теме
1 Желательно использовать display=block/none так как это свойство совсем убирает элемент с экрана в отличие от visibility которое просто делает элемент невидимым (были глюки когда нажимал на мемто невидимой кнопки и начинались вычисления забиндинные на эту кнопку)
2 А как универсальный конструктор сделать? а что самому слабо написать? ведь намного приятней свой код юзать, чем пользоваться левым? smile.gif), а вообще то исходники смотреть дело уголовно ненаказуемое

Автор: IZ@TOP 21.4.2003, 12:46
Цитата
2 А как универсальный конструктор сделать? а что самому слабо написать? ведь намного приятней свой код юзать, чем пользоваться левым? ), а вообще то исходники смотреть дело уголовно ненаказуемое

А я главного не пойму - как все это отображается (тоесть выводится печатается) я пробовал document.write/writeln но тогда все затирается ... sad.gif

Автор: simanyay 21.4.2003, 18:16
Принцип действий таков:
1. Делаешь столько слоёв сколько будет подменю (<div></div>)
У них ставишь свойства - visibilty = hidden, left = 0, top = 0, position = absolute
2. Делаешь сами меню
3. При наведении на меню (OnMouseMove) меняешь некоторые свойства у слоёв, а именно - visibility = visible (или show) left и top положение курсора
4. При отведении курсора (OnMouseOut) вертухаешь всё на место (т.е. свойства)
5. И так для каждого меню.
P.S. Если заинтересовался могу предложить проанализировать код http://www.webmoney.ru
Удачи!

Автор: simanyay 21.4.2003, 18:17
Если что-то не понятно, пиши попробую объяснить более подробно

Автор: IZ@TOP 24.4.2003, 16:47
Цитата
Если что-то не понятно, пиши попробую объяснить более подробно

Спасибо, вроде понял ... но это мне сейчас не нужно ... я этим в ближайшем будущем буду пользоваться ...

Автор: Loquacious 25.4.2003, 06:59
Iz@top, да нет... я думаю, ты этим даже заниматься не будеш! Так как.... короче проще попросить меня))) хэ-хэ-хэ-хэ-х-эх-э-хэ... а хотя для ентого меня надо сначало найти!!!





• сколько делал, но я делал с помощью проги которая все сама делает, но вот в код не заглядывал... мне даже интересно небыло, а теперя ... млин.... хэ-хэ-хэ-хэ-хэ...

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)