Здравствуйте. помогите, пожалуйста опустить меню (Главная / О нас / покупателям и т.д.) вниз, между серым полем и кнопкой "Каталог товаров".
Если это возможно: Хотелось бы что бы пункты меню были кнопками.
Нормально ли будет отображаться подобное меню на мобильных устройствах и в ИЕ?
Заранее спасибо.
0
Опустить Меню Ниже
Автор niko1a, 09 февр. 2015 23:35
Сообщений в теме: 3
#1
Отправлено 09 Февраль 2015 - 23:35
#2
Отправлено 10 Февраль 2015 - 01:04
В main.css найдите:
замените на:
далее в шаблоне HTML найдите:
перенесите его, расположив после:
также после перенесенного кода меню вставьте:
.mainmenu .menu{display:block;width: 700px;overflow:hidden;padding:20px 5px 0 5px;float:left;} .mainmenu.index .menu{padding:30px 0 0 160px;} .mainmenu ul li{position:relative;list-style:none;float:left;padding:10px 0px;margin:0 10px 0 0;} .mainmenu ul li a{padding:10px;z-index: 500;font-weight:bold;color:white;position:relative;} .mainmenu ul li:hover:after{width:100%;} .mainmenu ul li.selected:hover:after{width:0;} .mainmenu ul li a:hover{color:#DF747A;} .mainmenu ul li a:after{box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); -moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); -webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); transform: skew(-20deg); -moz-transform: skew(-20deg); -webkit-transform: skew(-20deg); transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -webkit-transition: 0.3s ease-in-out; content:' ';position:absolute;width:0;height:30px;background:white;transform:skew(-20deg);z-index:-1;left:0;top:7px;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-moz-transition:all 0.35s ease;-o-transition:all 0.35s ease;-ms-transition:all 0.35s ease;} .mainmenu ul li a:hover:after{width:100%;} .mainmenu ul li a.selected{color:#DF747A;} .mainmenu ul li a.selected:after{box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); -moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); -webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); transform: skew(-20deg); -moz-transform: skew(-20deg); -webkit-transform: skew(-20deg); transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -webkit-transition: 0.3s ease-in-out; content:' ';position:absolute;width:100%;height:30px;background:white;transform:skew(-20deg);z-index:-1;left:0;top:7px;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-moz-transition:all 0.35s ease;-o-transition:all 0.35s ease;-ms-transition:all 0.35s ease;}
замените на:
.menu{display:block;width: 700px;overflow:hidden;padding:20px 5px 0 5px;float:left;} .menu{padding:30px 0 0 160px;} .menu li{position:relative;list-style:none;float:left;padding:10px 0px;margin:0 10px 0 0;} .menu li a{padding:10px;z-index: 500;font-weight:bold;color:white;position:relative;} .menu li:hover:after{width:100%;} .menu li.selected:hover:after{width:0;} .menu li a:hover{color:#DF747A;} .menu li a:after{box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); -moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); -webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); transform: skew(-20deg); -moz-transform: skew(-20deg); -webkit-transform: skew(-20deg); transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -webkit-transition: 0.3s ease-in-out; content:' ';position:absolute;width:0;height:30px;background:white;transform:skew(-20deg);z-index:-1;left:0;top:7px;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-moz-transition:all 0.35s ease;-o-transition:all 0.35s ease;-ms-transition:all 0.35s ease;} .menu li a:hover:after{width:100%;} .menu li a.selected{color:#DF747A;} .menu li a.selected:after{box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); -moz-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); -webkit-box-shadow: 3px 3px 0 rgba(153, 153, 153, 0.2); transform: skew(-20deg); -moz-transform: skew(-20deg); -webkit-transform: skew(-20deg); transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -webkit-transition: 0.3s ease-in-out; content:' ';position:absolute;width:100%;height:30px;background:white;transform:skew(-20deg);z-index:-1;left:0;top:7px;transition:all 0.35s ease;-webkit-transition:all 0.35s ease;-moz-transition:all 0.35s ease;-o-transition:all 0.35s ease;-ms-transition:all 0.35s ease;}
далее в шаблоне HTML найдите:
<ul class="menu"> {% FOR menu %} {% FOR header %} {% FOR links %} <li class="{% IF menu.header.links.SELECTED %}selected{%ENDIF%}"><a class="menuparent {% IF menu.header.links.SELECTED %}selected{%ENDIF%}" href="{menu.header.links.URL}" {% IF menu.header.links.TITLE %}title="{menu.header.links.TITLE}"{% ENDIF %}>{menu.header.links.NAME}</a></li> {% ENDFOR %} {% ENDFOR %} {% ENDFOR %} </ul>
перенесите его, расположив после:
<noscript> <div class="noscript"> <div class="noscript-inner"> <p><strong>Мы заметили что у Вас выключен JavaScript.</strong></p> <p>Необходимо включить его для корректной работы сайта.</p> </div> </div> </noscript>
также после перенесенного кода меню вставьте:
<div class="clear"></div>
#3
Отправлено 10 Февраль 2015 - 21:46
После внесения изменений на сайте все поехало.
Помогите, пожалуйста.
imsleep.ru
Аккаунт SL-328526
Помогите, пожалуйста.
imsleep.ru
Аккаунт SL-328526
#4
Отправлено 11 Февраль 2015 - 00:11
Восстановите бэк ап в разделе Редактор шаблонов и повторите изменения, "поехать" сайт не должен, проверялось на стандартном коде шаблона Шоколад. Судя по результату у вас нарушен синтаксис.
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных