А Можно Поменять Верхнее Меню С Каталогом Местами

Хм. видимо вам нужно было дать больше информации, и уточнений. В меню на том сайте что вы привели находятся статические страницы которые имеют вложенность. Т.е вы не уточнили что подразумеваете под данным видом меню каталог или простые странички. Т.е простые странички с вложенностью в данный момент не получиться реализовать.

Если вам нужно сделать подобное меню из каталога товаров, то что-то подобное уже обсуждалось. почитайте данную тему  http://forum.storela...ch__1#entry2072

vadim_3383 (30 Июнь 2011 - 13:07) писал:

В принципе сделать меню со страничками подобным образом можно, но это не совсем просто в текущем формате работы модуля, поэтому создать его на html в разделе "Сайт" > "Редактор тем" проще, чем создавать в разделе "Сайт" > "Меню" блоки меню, которые затем будут встраиваться в html код. Например так:

<!-- Верхний блок навигации -->
<div class="containerin" id="top-menu">
  <ul class="pad-box cont620" id="mainmenu">
	<li><a href="/" title="На главную">Главная</a>
	  <ul>
		{% FOR menu %}
		  {% FOR header1 %}
			{% FOR links %}
			  <li><a href="{menu.header1.links.URL}" {% IF menu.header1.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header1.links.TITLE %}title="{menu.header1.links.TITLE}"{% ENDIF %}>{menu.header1.links.NAME}</a></li>
			{% ENDFOR %}
		  {% ENDFOR %}
		{% ENDFOR %}
	  </ul>
	</li>
	<li><a href="#" title="На главную">Ссылка 2</a>
	  <ul>
		{% FOR menu %}
		  {% FOR header %}
			{% FOR links %}
			  <li><a href="{menu.header2.links.URL}" {% IF menu.header2.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header2.links.TITLE %}title="{menu.header2.links.TITLE}"{% ENDIF %}>{menu.header2.links.NAME}</a></li>
			{% ENDFOR %}
		  {% ENDFOR %}
		{% ENDFOR %}
	  </ul>
	</li>
	<li><a href="#" title="На главную">Ссылка 3</a>
	  <ul>
		{% FOR menu %}
		  {% FOR header %}
			{% FOR links %}
			  <li><a href="{menu.header3.links.URL}" {% IF menu.header3.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header3.links.TITLE %}title="{menu.header3.links.TITLE}"{% ENDIF %}>{menu.header3.links.NAME}</a></li>
			{% ENDFOR %}
		  {% ENDFOR %}
		{% ENDFOR %}
	  </ul>
	</li>
	<li><a href="#" title="На главную">Ссылка 4</a>
	  <ul>
		{% FOR menu %}
		  {% FOR header %}
			{% FOR links %}
			  <li><a href="{menu.header4.links.URL}" {% IF menu.header4.links.SELECTED %}class="selected"{%ENDIF%} {% IF menu.header4.links.TITLE %}title="{menu.header4.links.TITLE}"{% ENDIF %}>{menu.header4.links.NAME}</a></li>
			{% ENDFOR %}
		  {% ENDFOR %}
		{% ENDFOR %}
	  </ul>
	</li>
  </ul>
  <div class="clr"></div>
</div>
<!-- end Верхний блок навигации -->

Но как видите из кода изменять верхние пункты меню (перемещать/переименовывать/изменять ссылки/добавлять новые пункты) придётся из редактора тем в шаблоне "html". Поскольку этот момент сейчас плохо автоматизирован и его приходится делать вручную, поэтому полностью сделать меню с удобной админкой в текущем формате не получается. Редактирование будет только для вложенных пунктов, а верхние менять надо будет ручками в коде. Эта задача пока еще лежит в задачнике в виде идеи...

Vaccina (01 Июль 2011 - 06:51) писал:

В том то и дело, чтобы сделать подобное меню из каталога товаров, но каталог должен располагаться вместо верхнего меню и раскрываться не вбок, а вниз. Самое первое сообщение в этой теме так и звучит: "А Можно Поменять Верхнее Меню С Каталогом Местами?", но ответа на этот вопрос в теме нет. Надеюсь, я правильно высказал свою мысль

Хм. изменения шаблона будут какие же. нужно будет только изменить немного css

Vaccina (03 Июль 2011 - 00:18) писал:

А можно подробнее? Во-первых - поменять местами. Во-вторых - раскрывающееся меню. Спасибо.

Можно у меня тут случайно получилось так сделать.
Сделайте все что было сверху, а потом измените
/* 2й уровень вложенности */
#nav ul {position:absolute;

на

/* 2й уровень вложенности */
#nav ul { top:0px;
а далее все, как было ранее написано

Попробовал поколдовать, поменял местами верхнее меню с каталогом, но столкнулся с проблемами:
1. Блоки новостей и статей сползли внутрь страницы.
2. В полученном коде стилей при желаемом расположении заголовков каталога, выпадающее меню расползается и никак этого не удается исправить.
Т.е. если оставить как предлагалось изначально /* 1й уровень вложенности */
#nav li {}, тогда меню красивое и ровное, но заголовки располагаются списком вниз, а нужно в ряд. А когда изменяешь на #nav li {float:left; margin-left:10px; margin-right:10px; top:10px;}, они становятся в ряд, но меню сбивается. Подскажите кто знает в чем проблема, что я делаю не так?
вот весь код, который получился

#nav{padding:0 0 42px 20px; margin:0; font-size:14px;}

/* Все уровни */
#nav li {text-align:left; position:relative; }
#nav li.over { z-index:999; }
#nav li.parent {}
#nav li a { display:block; text-decoration:none;}
#nav li a:hover { text-decoration:none;}
#nav li a span { display:block; white-space:nowrap; cursor:pointer; }
#nav li ul a span { white-space:normal; }

/* 1й уровень вложенности */
#nav li {float:left; margin-left:10px; margin-right:10px; top:10px;}
#nav li a{padding:0 0 0; font-weight:bold; color:#CDCDCD;line-height:normal; }
#nav li a:hover { color:#E0E0E0;}
#nav li.over a,
#nav li.active a { color:#E0E0E0; }

/* 2й уровень вложенности */
#nav ul {position:absolute; width:15em; top:14px; left:-10000px; border:0; padding:0; background:#B2B2B2; font-size:12px;}
#nav ul li {float:none; border-bottom:1px solid #FFF; }
#nav ul li.last { border-bottom:0; }
#nav ul li a { float:none; padding:3px 9px; font-weight:normal; color:#E3E3E3 !important; }
#nav ul li a:hover { color:#FFF !important; background:#333333; }
#nav ul li.active a,
#nav ul li.over a  { color:#FFF !important; background:#333333; }

/* Видимое меню */
#nav li.over ul {left:0px; }
#nav li.over ul li.over ul { left:15em; }
#nav li.over ul ul { left:-10000px; }
#nav li.over .indent-class{margin-left:230px;}
/********** Navigation > */

#nav li.level2 ul {
    display:none;
   }

   #nav li.level2:hover ul {
     display:block;
   }

сообщите ваш адрес сайта.

Vaccina (05 Июль 2011 - 09:53) писал:

www.tabletpc-shop.ru

но я сейчас вернул все как было, потому что, сильно сбивается отображение страницы, если например, в категории нет товара, то все блоки новостей и статей вместе с перенесенным каталогом просто съезжают влево страницы.

Чувствую, что решение где-то на поверхности, но никак не могу найти где. Помогите пожалуйста.

Хм.

Цитата

Смогу помочь только в если у вас не получается использовать приведенный код(т.е возникают ошибки), а так же в том случае если у вас установлен весь код на сайте. В вашем случае вероятнее всего вы допускаете ошибку при копировании или добавлении кода. Так же предположить или предугадать где происходит у вас ошибка не имеется возможным.
Попробуйте пройтись по данной теме еще раз и выполнить внимательно по порядку все действия.

Попробовал еще раз, меню получилось, но возникла проблема с обменом меню с каталогом. Блоки новостей и статей сползли влево на страницу и появились символы в виде точек над этими блоками. Причем, если зайти на страницу, например пустой категории меню, где нет товара, то блоки новостей и статей наползают на страницу еще больше. Помогите найти ошибку.

Это произошло потому - что вы нарушили вложенность. В данный момент у вас блоки выглядят так

<td class="content_catalog cont250">
  <div id="top-menu" class="pad-box">
   <ul id="mainmenu" class="pad-box cont250">
  </div>
  <li class="news_shop">
  <li class="news_articles">
 <div>
  <br>
 <div>
 <div align="right">
</td>

А должно быть что то типа этого

<td class="content_catalog cont250">
  <div class="pad-box">
   <ul class="leftmenu">
	<li class="categories">
	<li class="compare">
	<li class="news_shop">
  </ul>
 </div>
</td>

т.е у вас списки <li class="news_articles"> и т.д вылезли из тега <ul>

Оказывается существует еще одна проблема: в Chrome и Opera верхнее меню показывается нормально, а вот в IE раскрывающееся меню полупрозрачное и невозможно выбрать пункт меню, расположенный ниже первого, т.е. на первый мышь наводится, а при переводе курсора на следующий пункт меню исчезает. В чем тут загвоздка и можно ли это исправить?

как я понимаю проблема в IE7 дело в z-index
Видимо где-то неверно указан слой, а так же для IE нужно везде где указывается position указывать z-index

А как бы найти неверно указанный слой? И что значит "везде где указывается position указывать z-index"? До изменения каталога все нормально отображалось и нигде не указывался z-index, а теперь нужно везде?

z-index - это правило слоя для правильного написания верстики шаблона. По идее в классах там где указывается свойство position, должно указываться свойство z-index. z-index задает положение слоя относительно документа. Если нормальные браузеры могу поправить мелкие ошибки с слоями, то IE всячески отталкивает это дело. Нужно пройтись по всему стилю меню и стилям в которые включают в себя данное меню т.е родители, и добавить в нужные классы z-index с указанием слоя. и только в током случае IE нормально будет отображать данное меню

Vaccina (14 Июль 2011 - 21:48) писал:

Спасибо, все получилось.

После прописания кода выпадающего каталога, сами категории расползлись

как их вернуть на место?Чтоб длинные названия прописывались в две строчки, как в подкатегориях?
Все озвученные варианты в других темах положительного результата не дали.

Пожалуйста сообщите ваш адрес сайта, попробую помочь в решении вашей проблемы.