X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Выпадающее меню
GLUE
GLUE
Topic Starter сообщение 2.11.2008, 14:19; Ответить: GLUE
Сообщение #1


Помогите плиз, почти ничего не понимаю в написании сайтов, врубаюсь потихоньку редактируя шаблоны) На этом форуме нашел шаблон выпадающего меню, подогнал как мне надо, но кое-что не знаю как сделать
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>4 level drop-down menu</title>
<ul class="uz">
<li class="m"><a class="m" href="$HOME_PAGE_LINK$">Главная страница</a></li>
<li class="m"><a class="m" href="http://dtmracing.ucoz.ru/index/0-8">Необходимо для участия</a></li>
<li class="m"><a class="m" href="http://vkontakte.ru/club198272">В Контакте</a></li>
<li class="m"><a class="m" href="http://dtmracing.ucoz.ru/index/0-7">Сайт и партнерство</a></li>
<li class="m"><a class="m" href="http://dtmracing.ucoz.ru/forum/">Форум</a></li>
<li class="m"><a class="m" href="http://dtmracing.ucoz.ru/index/0-10">FAQ</a></li>
</ul>
<style type="text/css">
<!--
td.menu {
background-color: #f1f1ed;
text-align: center
}
td.menu a, table.submenu a, table.submenu2 a, table.submenu3 a {
color: #000000;
text-decoration: none
}
table.submenu {
border: solid 1px #000000;
background-color: #FEC883;
width: 200px;
visibility: hidden;
position: absolute; left: 190px;
text-align: center
}
--
>
</style>
<script type="text/javascript">
<!--
var oldId, oldBgColor;
function hiddenLayer(elem) {
document.getElementById(elem).style.visibility = 'hidden';
lightOff(); }
function showLayer(elem) {document.getElementById(elem).style.visibility = 'visible';}
function lightOn(elem) {
oldId = elem;
oldBgColor = document.getElementById(elem).style.background;
document.getElementById(elem).style.background = 'red'; }
function lightOff() {document.getElementById(oldId).style.background = oldBgColor;}
//--
>
</script>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="2">
<tr>
<!-- Первый пункт меню -->
<td class="menu" width="200px" id="menu0" onmouseover="showLayer('menu0_list'); lightOn('menu0');" onmouseout="hiddenLayer('menu0_list'); this.style.background='#f1f1ed';" onclick="document.location = 'menu1.php'">
<a href="menu1.php"><a href="http://imageshack.us"><img src="http://img223.imageshack.us/img223/2639/01sb2.png"></a></a>
</td>
<!-- Первый пункт меню -->

<!-- Подменю первого пункта меню -->
<td width="0px" valign="top">
<table id="menu0_list" class="submenu" onmouseover="showLayer('menu0_list')" onmouseout="hiddenLayer('menu0_list')">
<tr>
<td id="menu0-0" onmouseover="lightOn('menu0-0')" onmouseout="lightOff()" onclick="document.location = 'point11.php'">
<a href="point11.php">Регламент</a>
</td>
</tr>
<tr>
<td id="menu0-1" onmouseover="lightOn('menu0-1')" onmouseout="lightOff()" onclick="document.location = 'point11.php'">
<a href="point11.php">Календарь</a>
</td>
</tr>
<tr>
<td id="menu0-2" onmouseover="lightOn('menu0-2')" onmouseout="lightOff()" onclick="document.location = 'point11.php'">
<a href="point11.php">Составы команд</a>
</td>
</tr>
<tr>
<td id="menu0-3" onmouseover="lightOn('menu0-3')" onmouseout="lightOff()" onclick="document.location = 'point11.php'">
<a href="point11.php">Личный зачет</a>
</td>
</tr>
<tr>
<td id="menu0-4" onmouseover="lightOn('menu0-4')" onmouseout="lightOff()" onclick="document.location = 'point11.php'">
<a href="point11.php">Кубок конструкторов</a>
</td>
</tr>
</table>
</td>
<!-- Подменю первого пункта меню -->

<!-- Подменю второго пункта меню -->
<!-- Подменю второго пункта меню -->

<!-- Подменю третьего пункта меню -->
<!-- Подменю третьего пункта меню -->
</tr>
</table>
</body>
</html>


У меня и меню и подменю выделяются красным цветом, так как там прописано red. Это мне понятно) Но как мне сделать чтобы в подменю осталось выделение красным, а в самом меню, у меня там картинка

<tr>
<!-- Первый пункт меню -->
<td class="menu" width="200px" id="menu0" onmouseover="showLayer('menu0_list'); lightOn('menu0');" onmouseout="hiddenLayer('menu0_list'); this.style.background='#f1f1ed';" onclick="document.location = 'menu1.php'">
<a href="menu1.php"><a href="http://imageshack.us"><img src="http://img223.imageshack.us/img223/2639/01sb2.png"></a></a>
</td>


при наведении картнка менялась, то есть ссылалась на ссылку другой картинки?)

А, еще чуть не забыл, еще надо чтоб вокруг картинки в меню не было фиолетовой рамки)
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Galen
Galen
сообщение 2.11.2008, 15:16; Ответить: Galen
Сообщение #2


<tr>
<!-- Первый пункт меню -->
<td class="menu" width="200px" id="menu0" onmouseover="showLayer('menu0_list'); lightOn('menu0');" onmouseout="hiddenLayer('menu0_list'); this.style.background='#f1f1ed';" onclick="document.location = 'menu1.php'">
<a href="menu1.php"><a href="http://imageshack.us"><img src="http://img223.imageshack.us/img223/2639/01sb2.png"></a></a>
</td>
1. Вложенных в друг друга a быть не должно.
2. Чтобы не было рамки, напишите такое свойство: a img {border: 0;}
3. Чтобы картинка менялась, надо либо использовать скрипт, либо вставлять картинку как бэкграунд ссылки и менять её уже свойствами a:hover, a:link, a:visited.
4. А ещё у вас список почему-то в head...
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
GLUE
GLUE
Topic Starter сообщение 2.11.2008, 15:34; Ответить: GLUE
Сообщение #3


я в этом полный лол) поэтому если не трудно можешь еще написать где это все конкретно надо прописывать =)
с рамкой разобрался) а вот со сменой картинки нет =(
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Galen
Galen
сообщение 2.11.2008, 17:11; Ответить: Galen
Сообщение #4


Модеры будут ругаться - воспользуйтесь поиском по форуму сначала.
Это если без скрипта:
<head>
<style>
a.button {
display: block;
overflow: hidden;
width: 73px;
height: 44px;
background: url(q.gif) 0% 0%;
text-indent: -76px;
}
a.button:hover {
background: url(q.gif) 90% 0%; //тут задаётся смещение бэкграунда
}
</style>
</head>
<body>
<a href="#" class="button">Кнопка</a>
</body>

Картинка кнопки (в данном случае q.gif) должна содержать изображение этой самой кнопки в двух видах: сначала обычное, следом за ним изображение активной кнопки.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
GLUE
GLUE
Topic Starter сообщение 3.11.2008, 15:07; Ответить: GLUE
Сообщение #5


ооо получилось) приогромнейшее спасибо)
правадв все таки остался один недочетик в меню, в выпадающих подменю, когда сначала подменю открывается текст черный и нормальный, а после того как один раз на ссылку кликнешь, она после этого серого цвета и подчеркнутая, и вообще на сайт испытываю проблемы что пдчеркивание у ссылок не убрать.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Galen
Galen
сообщение 3.11.2008, 15:15; Ответить: Galen
Сообщение #6


Чтобы убрать подчёркивания у ссылок используйте свойство:
a {text-decoration: none;}


А внешний вид уже посещённых ссылок (тех по которым уже нажимали) определяется так:
a:visited {/* тут описание внешнего вида ссылки */}
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
GLUE
GLUE
Topic Starter сообщение 3.11.2008, 17:04; Ответить: GLUE
Сообщение #7


че-то неполучается) не лан все равно спс)

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыПеренести меню
1 Викторио_mw 1452 28.8.2018, 0:10
автор: TimurR
Открытая тема (нет новых ответов) Необходимо разрезать и установить Меню для группы ВКонтакте
2 boltuk 3398 4.12.2017, 14:44
автор: tezoro
Открытая тема (нет новых ответов) Помогите с меню - переделать в выпадающее
1 lepota 1128 4.12.2017, 13:29
автор: yury_mw
Открытая тема (нет новых ответов) Слайдер под меню
0 Olya_Poy 4633 29.11.2017, 11:09
автор: -garmoni-
Открытая тема (нет новых ответов) На разных разрешениях меню выглядит по разному
0 SPiar 4812 28.9.2017, 17:45
автор: -korotkov-


 



RSS Текстовая версия Сейчас: 29.3.2024, 0:40
Дизайн