Перейти к содержимому


Изменить Меню

меню

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 65

#41 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 14 Май 2015 - 06:53

Можно все корневые пункты вручную выводить, выстраивая уже необходимый порядок, единственное, что их уже не отредактируешь в разделе Сайт -Меню.

#42 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 14 Май 2015 - 07:32

Вроде получается. Есть пару нюансов:

1. Всплывающее меню постоянно в одном месте всплывает.
2. Как поменять цвет при наведении на подпункты всплявающего меню?
3. Расстояние между пунктами где уменьшить?

14-05-2015 13-19-50.png

#43 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 14 Май 2015 - 07:44

1. В main.css найдите примерно следующий код:
.menuWrap li {
  cursor: pointer;
  display: inline;
  list-style: outside none none;
  padding: 13px;
  transition: all 0.35s ease-in-out 0s;
}
замените его на:
.menuWrap li {
  cursor: pointer;
  display: inline;
  list-style: outside none none;
  padding: 13px;
  position: relative;
  transition: all 0.35s ease-in-out 0s;
}

далее найдите:
ul.vtoroc {
  background: rgba(0, 0, 0, 0.6);
  display: none;
  position: absolute;
  width: 200px;
  z-index: 999;
}

замените на:
ul.vtoroc {
  background: rgba(0, 0, 0, 0.6);
  display: none;
  left: 0;
  position: absolute;
  width: 200px;
  z-index: 999;
}

далее найдите:
.menuWrap {
  margin: 0 auto;
  overflow: hidden;
  padding: 10px 0;
}
замените на:
.menuWrap {
  margin: 0 auto;
  padding: 10px 0;
}

2. В main.css после:
ul.vtoroc li {
  display: block;
  padding: 2px 0;
}

вставьте:
ul.vtoroc li:hover {
  background: #000;
}

3. Перед:
.vtoroc li a, .vtoroc li a::before, .vtoroc li a::after {
  border: none !important;
}

вставьте:
.vtoroc li a {
  display: block;
  line-height: 20px;
}


#44 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 14 Май 2015 - 08:00

3. Это расстояние между подпунктами. А мне надо между пунктами, как я на скрине указал.

#45 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 14 Май 2015 - 08:08

В main.css найдите:
.menuWrap li {
  cursor: pointer;
  display: inline;
  list-style: outside none none;
  padding: 13px;
  transition: all 0.35s ease-in-out 0s;
}

после него пропишите:
menu .globmenuwrap .menuWrap > li {
  padding: 13px 5px;
}


#46 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 14 Май 2015 - 08:32

Спасибо. Вы супер...
Усть еще пару вопросов, но это по-позже...

#47 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 14 Май 2015 - 09:25

Задам сразу:
1. Где я могу изменить положение и скорость развертывания выпадающего меню и его размер? Мне нужно его сдвинуть ниже и по центру от родителя.

14-05-2015 15-03-42о.png

2. Как изменить рамку выпадающего меню. Округлить углы.

3. При наведении и когда активное меню отображается бордером. Можно чтоб оно еще меняло цвет при этом с эффектом впадины,и бордер остался?
4. При наведении на подпункт меню вызалит окошко с его названием.Как его убрать?

14-05-2015 15-05-30.png

5. И как все все это главное меню поднять выше т.е. наложить на рисунок шапки сайта???

14-05-2015 15-14-33.png

Спасибо вам огромное за помощь...

#48 Ирина345

Ирина345

    Активный участник

  • Модераторы
  • 5 709 сообщений

Отправлено 14 Май 2015 - 16:12

Просмотр сообщенияHiding (14 Май 2015 - 09:25) писал:

Задам сразу:
1. Где я могу изменить положение и скорость развертывания выпадающего меню и его размер? Мне нужно его сдвинуть ниже и по центру от родителя.

Прикрепленный файл 14-05-2015 15-03-42о.png

2. Как изменить рамку выпадающего меню. Округлить углы.

3. При наведении и когда активное меню отображается бордером. Можно чтоб оно еще меняло цвет при этом с эффектом впадины,и бордер остался?
4. При наведении на подпункт меню вызалит окошко с его названием.Как его убрать?

Прикрепленный файл 14-05-2015 15-05-30.png

5. И как все все это главное меню поднять выше т.е. наложить на рисунок шапки сайта???

Прикрепленный файл 14-05-2015 15-14-33.png

Спасибо вам огромное за помощь...
Здравствуйте,
1. найдите в main.css
ul.vtoroc {
  background: rgba(0, 0, 0, 0.6);
  display: none;
  left: 0;
  position: absolute;
  width: 200px;
  z-index: 999;
}
замените на

ul.vtoroc {
  background: rgba(0, 0, 0, 0.6);
  display: none;
  left: 0;
  position: absolute;
  width: 200px;
  z-index: 999;
  margin-left: -55px;
border-radius: 12px;
}

что бы двигать под меню, изменяете значение   margin-left: -55px;
что бы изменить радиус округления, измените значение border-radius: 12px;

3. добавьте в конец main.css
.menuWrap li a:hover {
color: darkcyan;
box-shadow: 1px 1px 6px #000000;
}
4. найдите в шаблоне HTML
{% IF menu.fat_burn.links.TITLE %}title="{menu.fat_burn.links.TITLE}"{% ENDIF %}
и удалите
для остальных пунктов меню, те же действия, только переменные другие

#49 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 15 Май 2015 - 03:03

Спасибо большое.

#50 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 15 Май 2015 - 03:33

А как все это главное меню поднять выше т.е. наложить на рисунок шапки сайта???

#51 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 15 Май 2015 - 03:41

В main.css найдите:
menu {
  position: relative;
  width: 100%;
}

замените на:
menu {
  margin-top: -10px;
  position: relative;
  width: 100%;
}


#52 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 15 Май 2015 - 10:04

Не то. Я уже по-другому сделал. Спасибо.

#53 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 20 Май 2015 - 11:27

Просмотр сообщенияVaccina (15 Май 2015 - 03:41) писал:

В main.css найдите:
menu {
position: relative;
width: 100%;
}

замените на:
menu {
margin-top: -10px;
position: relative;
width: 100%;
}

А подскажите пожалуйста как его прозрачным сделать? Как верхнее меню у меня.

rgba(0, 0, 0, 0.6) не помогает.

#54 Dars

Dars

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 1 410 сообщений

Отправлено 20 Май 2015 - 11:42

Просмотр сообщенияHiding (20 Май 2015 - 11:27) писал:

А подскажите пожалуйста как его прозрачным сделать? Как верхнее меню у меня.

rgba(0, 0, 0, 0.6) не помогает.
В шаблоне HTML найдите код:

	  <menu class="theme-color">

и замените его на:

	  <menu>


#55 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 20 Май 2015 - 11:52

Отлично. Спасибо.

#56 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 20 Май 2015 - 12:11

А как изменить цвет в #search_mini_form?
А то я накасячил чуть-чуть...

20-05-2015 18-12-30.png

#57 Firefly

Firefly

    Активный участник

  • Модераторы
  • 3 810 сообщений

Отправлено 20 Май 2015 - 12:15

Просмотр сообщенияHiding (20 Май 2015 - 12:11) писал:

А как изменить цвет в #search_mini_form?

Здравствуйте.
Зайдите в админ. панель -> Сайт -> Редактор шаблонов -> Стили -> main.css, найдите код:
#search_mini_form input{padding:6px 90px 6px 4px;font-size:14px;color:white;}

Замените на:
#search_mini_form input{padding:6px 90px 6px 4px;font-size:14px;color: black;}
Или измените код цвета параметра color на любой другой.

#58 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 20 Май 2015 - 12:18

Я имею ввиду сам фон поиска.

#59 Dars

Dars

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 1 410 сообщений

Отправлено 20 Май 2015 - 12:21

Просмотр сообщенияHiding (20 Май 2015 - 12:18) писал:

Я имею ввиду сам фон поиска.
Тогда строку:

#search_mini_form input{padding:6px 90px 6px 4px;font-size:14px;color: black;}

замените на:

#search_mini_form input{padding:6px 90px 6px 4px;font-size:14px;color: black; background:green;}

green замените на нужный вам цвет.

#60 Hiding

Hiding

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 252 сообщений

Отправлено 20 Май 2015 - 12:26

Спасибо.





Темы с аналогичным тегами меню

Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных