Страница 1 из 512345»
Форум про uCoz » Раздел uCoz » Вопросы по uCoz » проблема с горизонтальным меню (Нужна помощь с горизонт меню)
проблема с горизонтальным меню
White_Wolf
Дата: Вторник, 10.12.2013, 03:03 | Сообщение # 1
Пользователи
Сообщений:124
Награды: 0


Здраствуйте, заметил небольшую проблемку на сайте, при открытии горизонтального меню, точнее наведении на него указателя, материалы первого контейнера как бы накладываються на надписи меню, подскажите, как это исправить???
ссылка oceansoft.at.ua
Прикрепления: 2342954.png(119Kb)


Сообщение отредактировал White_Wolf - Вторник, 10.12.2013, 03:36
ArtElect
Дата: Вторник, 10.12.2013, 04:58 | Сообщение # 2
Проверенные
Сообщений:389
Награды: 1



Цитата
Главная страница, Фото, Онлайн помощь, FAQ, Правообладателям, World of Tanks, Загрузки для Windows, О сайте
Это твоё меню.

Тебе не кажется что там лишний раздел? Я его подчеркнул! wacko
К стати, сделай расстановку слотов как я переписал в цитате!!! и всё будет Very nice wink biggrin


Закон и порядок бл*ть!
๖ۣۜInspire
Дата: Вторник, 10.12.2013, 14:56 | Сообщение # 3
Администраторы
Сообщений:598
Награды: 2


Код
ul#cssmenu ul {
margin: 0 auto;
border: 0 none;
padding: 0;
width: 160px;
list-style: none;
display: none;
position: absolute;
top: 30px;
left: 0;
z-index: 1;
}




Моё портфолио
White_Wolf
Дата: Вторник, 10.12.2013, 22:04 | Сообщение # 4
Пользователи
Сообщений:124
Награды: 0


Цитата Sib4ick ()
Главная страница, Фото, Онлайн помощь, FAQ, Правообладателям, World of Tanks, Загрузки для Windows, О сайте
Это твоё меню.

Тебе не кажется что там лишний раздел? Я его подчеркнул!

Кажется, но этот раздел мне тоже нужен, так как файлы от туда могим моим знакомым нужны, но я не знаю куда его втулить?
а насчёт перестановки- сделаю, мне идея нравиться, за код ниже от Суперменыча спасибки, щас опробую.

Добавлено (10.12.2013, 19:07)
---------------------------------------------
может сделать вкладку "игры"- а потом второй уровень будет этот раздел? только тогда я без понятия как прописать чтобы те вкдадки, которые в этом разделе, стали 3 уровня соответственно.

Добавлено (10.12.2013, 19:08)
---------------------------------------------
Спасибо за код, сработало:)

Добавлено (10.12.2013, 21:27)
---------------------------------------------
подскажите, а как сделать меню, которое уже есть на сайте у меня, не 2х, а 3х уровневым??? типа категория, вкладка, вариант во вкладке?

Добавлено (10.12.2013, 22:04)
---------------------------------------------
Вот код меню:

Код
ul#cssmenu {

margin: 0 auto;
border: red 1px solid;
padding: 0;
list-style: none;
background: url(http://oceansoft.at.ua/_img/3.png);
height: 30px;
font: bold 12px/28px Verdana, Arial;
border-left:dark 1px solid;
color: white;
display: table;
width: 100%;
}

ul#cssmenu li {
margin: 0 auto;
border: darkred 1px solid;
padding: 0;
float: left;
display: inline;
list-style: none;
background: url( http://oceansoft.at.ua/_img/3.png);
position: relative;
height: 30px;
}

ul#cssmenu ul {
margin: 0 auto;
border: 0 none;
padding: 0;
width: 160px;
list-style: none;
display: none;
position: absolute;
top: 30px;
left: 0;
}

ul#cssmenu ul:after {
clear: both;
display: block;
font: 1px/0px serif;
content: ".";
height: 0;
visibility: hidden;
}

ul#cssmenu ul li {
width: 150px;
float: center;
display: block !important;
display: inline;
border: red 1px solid;
}

/* Main Menu */
ul#cssmenu a {
border: 0px;
padding: 0 10px;
float: none !important;
float: left;
display: block;
background: url(http://oceansoft.at.ua/_img/3.png);
color: red;
font: bold 12px/28px Verdana, Arial;
text-decoration: none;
height: auto !important;
height: 1%;
}

/* Main Menu Hover */
ul#cssmenu a:hover,
ul#cssmenu li:hover a,
ul#cssmenu li.iehover a {
border-top: 2px solid #FFFFFF;
background: ;
color:white;
border-top:#D2B48C 1px solid;
}

/* Second Menu */
ul#cssmenu li:hover li a,
ul#cssmenu li.iehover li a {
border-top: 2px solid #FFFFFF;
float: none;
background: darkred;
color: white;
}

/* Second Menu Hover */
ul#cssmenu li:hover li a:hover,
ul#cssmenu li:hover li:hover a,
ul#cssmenu li.iehover li a:hover,
ul#cssmenu li.iehover li.iehover a {
border-top: 2px solid #FFFFFF;
background: red;
color:white;
border:darkred 1px solid;
}

ul#cssmenu ul ul {
display: none;
position: absolute;
top: 0;
left: 150px;
}

ul#cssmenu li:hover ul ul,
ul#cssmenu li.iehover ul ul {
display: none;
}

ul#cssmenu li:hover ul,
ul#cssmenu ul li:hover ul,
ul#cssmenu li.iehover ul,
ul#cssmenu ul li.iehover ul {
display: block;
}
ul#cssmenu ul {
margin: 0 auto;
border: 0 none;
padding: 0;
width: 160px;
list-style: none;
display: none;
position: absolute;
top: 30px;
left: 0;
z-index: 1;
}
// JavaScript Document
function cssmenuhover()
{
if(!document.getElementById("cssmenu"))
return;
var lis = document.getElementById("cssmenu").getElementsByTagName("LI");
for (var i=0;i<lis.length;i++)
{
lis[i].onmouseover=function(){this.className+=" iehover";}
lis[i].onmouseout=function() {this.className=this.className.replace(new RegExp(" iehover\b"), "");}
}
}
if (window.attachEvent)
window.attachEvent("onload", cssmenuhover);
๖ۣۜInspire
Дата: Вторник, 10.12.2013, 22:15 | Сообщение # 5
Администраторы
Сообщений:598
Награды: 2


здесь только CSS нужен ещё HTML



Моё портфолио
Kosten
Дата: Вторник, 10.12.2013, 22:19 | Сообщение # 6
Администраторы
Сообщений:12664
Награды: 39


Ребята, плиз пользуйтесь
Код
Код


๖ۣۜInspire
Дата: Вторник, 10.12.2013, 22:36 | Сообщение # 7
Администраторы
Сообщений:598
Награды: 2


Код

<style>
ul#cssmenu {  

margin: 0 auto;  
border: red 1px solid;  
padding: 0;  
list-style: none;  
background: url(http://oceansoft.at.ua/_img/3.png);  
height: 30px;  
font: bold 12px/28px Verdana, Arial;  
border-left:dark 1px solid;  
color: white;  
display: table;  
width: 100%;  
}  

ul#cssmenu li {  
margin: 0 auto;  
border: darkred 1px solid;  
padding: 0;  
float: left;  
display: inline;  
list-style: none;  
background: url( http://oceansoft.at.ua/_img/3.png);  
position: relative;  
height: 30px;  
}  

ul#cssmenu ul {  
margin: 0 auto;  
border: 0 none;  
padding: 0;  
width: 160px;  
list-style: none;  
display: none;  
position: absolute;  
top: 30px;  
left: 0;  
}  

ul#cssmenu ul:after {  
clear: both;  
display: block;  
font: 1px/0px serif;  
content: ".";  
height: 0;  
visibility: hidden;  
}  

ul#cssmenu ul li {  
width: 150px;  
float: center;  
display: block !important;  
display: inline;  
border: red 1px solid;  
}  

/* Main Menu */  
ul#cssmenu a {  
border: 0px;  
padding: 0 10px;  
float: none !important;  
float: left;  
display: block;  
background: url(http://oceansoft.at.ua/_img/3.png);  
color: red;  
font: bold 12px/28px Verdana, Arial;  
text-decoration: none;  
height: auto !important;  
height: 1%;  
}  

/* Main Menu Hover */  
ul#cssmenu a:hover,  
ul#cssmenu li:hover a,  
ul#cssmenu li.iehover a {  
border-top: 2px solid #FFFFFF;  
background: ;  
color:white;  
border-top:#D2B48C 1px solid;  
}  

/* Second Menu */  
ul#cssmenu li:hover li a,  
ul#cssmenu li.iehover li a ,
.dropli a{  
border-top: 2px solid #FFFFFF;  
float: none;  
background: darkred;  
color: white;  
}  

/* Second Menu Hover */  
ul#cssmenu li:hover li a:hover,  
ul#cssmenu li:hover li:hover a,  
ul#cssmenu li.iehover li a:hover,  
ul#cssmenu li.iehover li.iehover a {  
border-top: 2px solid #FFFFFF;  
background: red;  
color:white;  
border:darkred 1px solid;  
}  

ul#cssmenu ul ul {  
display: none;  
position: absolute;  
top: 0;  
left: 150px;  
}  

ul#cssmenu li:hover ul ul,  
ul#cssmenu li.iehover ul ul {  
display: none;  
}  

ul#cssmenu li:hover ul,  
ul#cssmenu ul li:hover ul,  
ul#cssmenu li.iehover ul,  
ul#cssmenu ul li.iehover ul {  
display: block;  
}  
ul#cssmenu ul {  
margin: 0 auto;  
border: 0 none;  
padding: 0;  
width: 160px;  
list-style: none;  
display: none;  
position: absolute;  
top: 30px;  
left: 0;  
z-index: 1;  
}  
li.drop1h:hover .drop1{
display:block;
}
.drop1 {
position: absolute;
display: none;
margin-left: 151px;
margin-top: -31px;
}
.dropli{
min-width:150px;
background:darkness;
}
.dropli a {
min-width: 150px;
}
.dropli a:hover{
background:darkred !important;
}
</style>
<ul id="cssmenu">
<center>
  <li><a href="http://oceansoft.at.ua/">Главная страница</a>
  <ul><li><a href="http://oceansoft.at.ua/news/">Новости сайта</a></li>
  <li><a href="http://oceansoft.at.ua/publ">Интересное</a></li>
  </ul>
  </li>
  <li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/1/">Загрузки для Windows</a>
  <ul>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/skachat_windows/3">Скачать Windows</a></li>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/sistemnye/4">Для системы</a></li>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/grafika/6">Графика</a></li>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/ofisnye/7">Офисные</a></li>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/aktivatory/5">Активаторы</a></li>
  </ul>
  </li>
  <li><a href="http://worldoftanks.ru">World of Tanks</a>
<ul>
<li class="drop1h"><a href="http://worldoftanks.ru/ru/content/docs/update/">Скачать игру</a><div class="drop1"><div class="dropli"><a href="http://oceansoft.at.ua/load/wot/modpaki/9">Модпаки</a></div><div class="dropli"><a href="http://oceansoft.at.ua/load/wot/modpaki/9">Модпаки</a></div><div class="dropli"><a href="http://oceansoft.at.ua/load/wot/modpaki/9">Модпаки</a></div><div class="dropli"><a href="http://oceansoft.at.ua/load/wot/modpaki/9">Модпаки</a></div></div></li>
  <li><a href="http://oceansoft.at.ua/load/wot/modpaki/9">Модпаки</a></li>
  <li><a href="http://oceansoft.at.ua/load/wot/ozvuchka/11">Озвучка</a></li>
  <li><a href="http://oceansoft.at.ua/load/wot/ikonki/13">Иконки</a></li>
  <li><a href="http://oceansoft.at.ua/load/wot/pricely/10">Прицелы</a></li>
  <li><a href="http://oceansoft.at.ua/load/wot/khvm/12">ХВМ</a></li>
  <li><a href="http://oceansoft.at.ua/load/wot/angary/15">Ангары</a></li>
  <li><a href="http://oceansoft.at.ua/load/wot/shkurki/14">Шкурки</a></li>
  <li><a href="http://oceansoft.at.ua/load/wot/video/16">Видео</a></li>
</ul>
</li>

  <li><a href="http://oceansoft.at.ua/photo">Фото</a>
<ul>
<li><a href="http://oceansoft.at.ua/photo/zastavki/1">Заставки</a></li>
  <li><a href="http://oceansoft.at.ua/photo/jumor/2">Юмор</a></li></ul>
</li>
  <li><a href="http://oceansoft.at.ua/index/onlajn_pomoshh/0-5">Онлайн помощь</a>
</li>
<li>  
  <a href="http://oceansoft.at.ua/faq">FAQ</a>  
  </li><li>  
  <a href="http://oceansoft.at.ua/index/pravoobladateljam/0-4">Правообладателям</a>  
  </li><li>  
  <a href="http://oceansoft.at.ua/index/0-2">О сайте</a>  
  </li>
   
  </center>
</ul>


world of tanks - скачать игру




Моё портфолио
White_Wolf
Дата: Вторник, 10.12.2013, 22:39 | Сообщение # 8
Пользователи
Сообщений:124
Награды: 0


Цитата Supermenыч ()
здесь только CSS нужен ещё HTML

а вот html код:

Код
<ul id="cssmenu">
<center>
<li><a href="http://oceansoft.at.ua/">Главная страница</a>
<ul><li><a href="http://oceansoft.at.ua/news/">Новости сайта</a></li>
<li><a href="http://oceansoft.at.ua/publ">Интересное</a></li>
</ul>
</li>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/1/">Загрузки для Windows</a>
<ul>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/skachat_windows/3">Скачать Windows</a></li>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/sistemnye/4">Для системы</a></li>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/grafika/6">Графика</a></li>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/ofisnye/7">Офисные</a></li>
<li><a href="http://oceansoft.at.ua/load/zagruzki_dla_windows/aktivatory/5">Активаторы</a></li>
</ul>
</li>
<li><a href="http://worldoftanks.ru">World of Tanks</a>
<ul>
<li><a href="http://worldoftanks.ru/ru/content/docs/update/">Скачать игру</a></li>
<li><a href="http://oceansoft.at.ua/load/wot/modpaki/9">Модпаки</a></li>
<li><a href="http://oceansoft.at.ua/load/wot/ozvuchka/11">Озвучка</a></li>
<li><a href="http://oceansoft.at.ua/load/wot/ikonki/13">Иконки</a></li>
<li><a href="http://oceansoft.at.ua/load/wot/pricely/10">Прицелы</a></li>
<li><a href="http://oceansoft.at.ua/load/wot/khvm/12">ХВМ</a></li>
<li><a href="http://oceansoft.at.ua/load/wot/angary/15">Ангары</a></li>
<li><a href="http://oceansoft.at.ua/load/wot/shkurki/14">Шкурки</a></li>
<li><a href="http://oceansoft.at.ua/load/wot/video/16">Видео</a></li>
</ul>
</li>

<li><a href="http://oceansoft.at.ua/photo">Фото</a>
<ul>
<li><a href="http://oceansoft.at.ua/photo/zastavki/1">Заставки</a></li>
<li><a href="http://oceansoft.at.ua/photo/jumor/2">Юмор</a></li></ul>
</li>
<li><a href="http://oceansoft.at.ua/index/onlajn_pomoshh/0-5">Онлайн помощь</a>
</li>
<li>
<a href="http://oceansoft.at.ua/faq">FAQ</a>
</li><li>
<a href="http://oceansoft.at.ua/index/pravoobladateljam/0-4">Правообладателям</a>
</li><li>
<a href="http://oceansoft.at.ua/index/0-2">О сайте</a>
</li>

</center>
</ul>
๖ۣۜInspire
Дата: Вторник, 10.12.2013, 22:43 | Сообщение # 9
Администраторы
Сообщений:598
Награды: 2


White_Wolf, уже ненадо smile



Моё портфолио
White_Wolf
Дата: Вторник, 10.12.2013, 23:01 | Сообщение # 10
Пользователи
Сообщений:124
Награды: 0


Огромное, спасибо всем, очень помогли, тоесть теперь так можно проделать с каждым разделом? и последний вопрос, извините что надоедаю, где именно задавать рамку вокруг пункта 3 го уровня меню и цвет её заливки, а так же цвет текста ссылки в этом пункте??

Добавлено (10.12.2013, 22:58)
---------------------------------------------
просто захотелось придать немного красоты... вот только что с этим пунктом "Worldoftanks" делать, он ведь и вправду в общий формат сайта не вписывается, но как бы нужен... Что посоветуете?

Добавлено (10.12.2013, 22:59)
---------------------------------------------
А сайт реально крутой у Вас... где можно отзыв оставить??? biggrin

Добавлено (10.12.2013, 23:01)
---------------------------------------------
Интересно, как Вам вообще решение по дизайну сайт? норм или нет???

๖ۣۜInspire
Дата: Вторник, 10.12.2013, 23:09 | Сообщение # 11
Администраторы
Сообщений:598
Награды: 2


1)
Код

.dropli a {  
min-width: 150px;  
}  
.dropli a:hover{  
background:darkred !important;  
}


если не получиться обращайся, и да так можно хоть где сделать.
2)Если играешь в неё то можно оставить
3)http://zornet.ru/gb
4)хорошо smile




Моё портфолио
White_Wolf
Дата: Четверг, 12.12.2013, 01:26 | Сообщение # 12
Пользователи
Сообщений:124
Награды: 0


а можно ещё вопросик???, последняя часть кода мне уже была написана, ну да ладно, подправил под себя, спасибо, но обнаружил крайне неприятную штуку, гляньте на сайте на кнопку входа через uid... Kак поднять эту кнопку входа на сайт выше и размер в высоту подровнять к остальным надписям?
๖ۣۜInspire
Дата: Четверг, 12.12.2013, 10:07 | Сообщение # 13
Администраторы
Сообщений:598
Награды: 2


Код
.ulogin-btn {
text-align: center !important;
padding: 0px 0 2px 0;
margin-top: -1px;
}




Моё портфолио
White_Wolf
Дата: Пятница, 13.12.2013, 01:27 | Сообщение # 14
Пользователи
Сообщений:124
Награды: 0


вставил код в css, не помогло, а ещё варианты???
๖ۣۜInspire
Дата: Пятница, 13.12.2013, 14:38 | Сообщение # 15
Администраторы
Сообщений:598
Награды: 2


.ulogin-btn {
text-align: center !important;
padding: 0px 0 2px 0 !important;
margin-top: -1px !important;
}




Моё портфолио
Форум про uCoz » Раздел uCoz » Вопросы по uCoz » проблема с горизонтальным меню (Нужна помощь с горизонт меню)
Страница 1 из 512345»
Поиск: