Помогите разобраться с Wayfinder'ом

10 Posts

anatol Reply #1, 19 years, 1 month ago

хочу сделать меню такое же как на сайте imdkb.com
Используется ява-скрипт библиотека jQuery
CSS - код выглядит так:


a {text-decoration: none;font-size: 11pt; font-family: Verdana,Arial,Helvetica,sans-serif;color:#000; font-weight: bold; }
.hd {border-left: 1px solid #B9B9B9;border-top: 1px solid #fff;border-bottom: 1px solid #fff; display:none;  margin: 3px 3px 3px 8px;   }
.nav {margin:0; padding:0;}
.nav div { padding: 2px;}
.cursor{cursor: pointer;}
.hd a {
 display: block; 
 padding: 2px; 
 margin: 3px ; 
 font-size: 9pt; font-family: Verdana,Arial,Helvetica,sans-serif;
 text-decoration: none;
 color:#2f5a81;
 margin-left: 15px;
}
.hd a:hover {  text-decoration:underline;}

JavaScript - код:

<script type="text/javascript">
<!--//
		$(function() {
			$(".nav").click(function() {
				$(this).next().slideToggle();
				});
		});
//-->
</script>

HTML - код выглядит так:

<div id="menu">
	<div><a href="#">Новости</a></div>
	<div class="nav" >
	  <h5 class="cursor">О нас</h5>
	</div>
	<div class="hd">
		 <div><a href="#">История ИМДКБ</a></div>
		 <div><a href="#">Развитие ИМДКБ</a></div>
	</div>
	<div class="nav"><h5 class="cursor" >Отделения</h5></div>
	<div class="hd">
		<div><a href="#">Лабораторно-дигностическое</a></div>
		<div><a href="#">Восстановительного лечения</a></div> 
	</div>
	<div><a href="#">Развитие</a></li>  </div>
	<div class="nav"><h5 class="cursor">Публикации</h5></div>
		<div class="hd">
			<div><a href="#">Общие</a></div>
			<div><a href="#">Научные</a></div>
		</div>
</div>

подскажите как такое реализовать с помощью Wayfinder’а

10 Posts

anatol Reply #2, 19 years, 1 month ago

не пойму в чём дело, делаю чанк wfMenuIMDKB

<div id="menu">[+wf.wrapper+]</div>

вызываю

[[Wayfinder? &startId=`0` &level=`2` &outerTpl=`wfMenuIMDKB ` &debug=1]]

при отладке показывает

outerTpl	<ul[+wf.classes+]>[+wf.wrapper+]</ul>

как сделать что бы всё меню было в блоке <div id="menu">...</div>

742 Posts

[e]Bu$ter Reply #3, 19 years, 1 month ago

как сделать что бы всё меню было в блоке <div id="menu">...</div>

Вот так?

<div id="menu">[[Wayfinder? &startId=`0` &level=`2`]]</div>

10 Posts

anatol Reply #4, 19 years, 1 month ago

Quote from: [e

Bu$ter link=topic=17904.msg112519#msg112519 date=1188976038]
Вот так?
<div id="menu">[[Wayfinder? &startId=`0` &level=`2`]]</div>

в шаблоне страницы Wayfinder я так и вызываю.
в документации написано:

&outerTpl — имя чанка, описывающего внешний контейнер

но при отладке показывает что outerTpl использует стандартный шаблон т.е. <ul >[+wf.wrapper+]</ul>

1,620 Posts

Aleksey Stepanov Reply #5, 19 years, 1 month ago

посмотрите, нет ли у вас пробела после названия шалона в вызове сниппета

"Und wenn du lange in einen Abgrund blickst, blickt der Abgrund auch in dich hinein."

Не используйте Revo для "просто сайтов". Используйте Evo

Who can defeat the Russian bear?

10 Posts

anatol Reply #6, 19 years, 1 month ago

Quote from: aleksey.stepanov at Sep 05, 2007, 08:02 AM

посмотрите, нет ли у вас пробела после названия шалона в вызове сниппета

спасибо, помогло...

Всё , с меню разобрался !

Не большой отчёт как всё это происходило.
Нужно создать двухуровневое меню, второй уровень меню должен быть скрыт. Выбрал JavaScript-библиотеку jQuery, с ней легче работать.
стиль меню:

#menu {  float: left;  border: 1px solid #fff;  width: 210px;  padding: 5px 5px 5px 40px;  margin: 10px 10px 20px 5px; }

.hd {border-left: 1px solid #B9B9B9;border-top: 1px solid #fff;border-bottom: 1px solid #fff; display:none;  margin: 3px 3px 3px 8px;   }
.nav {margin:0; padding:0;}
.nav div { padding: 2px;}
.cursor{cursor: pointer;}
.hd a { display: block;  padding: 2px;  margin: 3px ;  font-size: 9pt; font-family: Verdana,Arial,Helvetica,sans-serif; text-decoration: none;
 color:#2f5a81; margin-left: 15px;}
.hd a:hover {  text-decoration:underline;}

меню делаю div’ами а не списками(ul)

чанк outerTpl:

[+wf.wrapper+]

чанк parentRowTpl(меню которое содержит строки меню второго уровня):

<div class="nav"><h5 class="cursor" >[+wf.title+] </h5></div>
<div class="hd">
[+wf.wrapper+] <- не сразу дошло что сюда надо вставить "wrapper" для отображения строк меню второго уровня
</div>

чанк innerRowTpl(строки меню второго уровня):

<div><a href="[+wf.link+]" title="[+wf.title+]" [+wf.attributes+]>[+wf.linktext+]</a></div>

чанк rowTpl(просто строки меню, не являющиеся папками):

<div><a href="[+wf.link+]" title="[+wf.title+]" [+wf.attributes+]>[+wf.linktext+]</a></div>

ну и сам вызов Wayfinder’а в шаблоне:

<!-- menu -->
<div id='menu'>
[[Wayfinder? &startId=`0`&level=`2`&outerTpl=`outerTpl`&parentRowTpl=`parentRowTpl`&rowTpl=`rowTpl`&innerRowTpl=`innerRowTpl`]]
</div>
<!-- /menu -->

JavaScript-код:

<script type="text/javascript">
<!--//
		$(function() {
			$(".nav").click(function() {
				$(this).next().slideToggle();
				});
		});
//-->
</script>

Всем спасибо, тема закрыта.