Форум

tom · #11 (**permalink**) 29.11.2010, 18:45

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

tom · #12 (**permalink**) 30.11.2010, 02:19

рони · #13 (**permalink**) 30.11.2010, 05:38

tom,
Проблему надо локализовать и привести короткий неработающий код...
В вашем случае часто помогает получасовая медитация над мантрой:
ID может быть только один на странице.
Если просветления не наступило можно посмотреть рабочий код ниже...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://radugaspa.ru/mootools.svn.js"></script>
<style type="text/css">
body{font-family:Arial, Helvetica, sans-serif; font-size:13px;}
/* -------------------------------------------------------- */
/* BUTTON													*/
.button{
	color:#000000;
	clear:both;
	display:block;
	float:left;
	font-size:13px;
	font-weight:bold;
	height:31px;
	line-height:31px;
	width:auto;
	margin-right:30px;
}
	a.button {
		text-decoration:none;
	}
	.button span {

		display:block;
		height:31px;
		line-height:31px;
		padding-left:10px;
		padding-right:8px;
		margin-right:20px;
	}
/* -------------------------------------------------------- */
/* MENU														*/
.v-menu{
	border:solid 1px #7F9FBF;
	width:200px;
	clear:both;
}
	ul.v-menu, .v-menu li{
		padding:0; 
		margin:0;
		list-style:none;
	}
	ul.v-menu{
		clear:both;
		margin-top:6px;
		padding:6px 10px;
	}
		.v-menu li a{
			color:#555555;
			font-weight:bold;
			display:block;
			border-top:solid 1px #DEDEDE;
			padding:4px;
			text-decoration:none;
		}
		.v-menu li a:hover{
			color:#999999;
		}

</style>
<!-- Mootools -->
<script type="text/javascript">
		window.addEvent('domready', function(){
			//-vertical
			
			var mySlide = new Fx.Slide('v-menu');
			mySlide.hide();
			$('toggle').addEvent('click', function(e){
				e = new Event(e);
				mySlide.toggle();
				e.stop();
			});
             var mySlide1 = new Fx.Slide('v-menu1');
			mySlide1.hide();
			$('toggle1').addEvent('click', function(e){
				e = new Event(e);
				mySlide1.toggle();
				e.stop();
			});
             var mySlide2 = new Fx.Slide('v-menu2');
			mySlide2.hide();
			$('toggle2').addEvent('click', function(e){
				e = new Event(e);
				mySlide2.toggle();
				e.stop();
			});

		}); 
	</script>

</head>

<body>
<table width="600" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="50%" height="45"><h2>Меню</h2></td>
</tr>
<tr>
<td width="50%" valign="top">
  <a href="#" id="toggle" class="button"><span>Нажмите здесь</span></a>
  <div style="clear:both">
  <ul id="v-menu" class="v-menu">
  <li><a href="p1.html">Technology</a></li>
  <li><a href="p2.html">Design</a></li>
  <li><a href="p3.html">Css Gallery</a></li>
  <li><a href="p4.html">Entertainment</a></li>
  <li><a href="p5.html">Programming</a></li>
  </ul>
</div></td>
</tr>
<tr>
<td width="50%" valign="top">
  <a href="#" id="toggle1" class="button"><span>Нажмите здесь</span></a>
  <div style="clear:both">
  <ul id="v-menu1" class="v-menu">
  <li><a href="p1.html">Technology</a></li>
  <li><a href="p2.html">Design</a></li>
  <li><a href="p3.html">Css Gallery</a></li>
  <li><a href="p4.html">Entertainment</a></li>
  <li><a href="p5.html">Programming</a></li>
  </ul>
</div></td>
</tr>
<tr>
<td width="50%" valign="top">
  <a href="#" id="toggle2" class="button"><span>Нажмите здесь</span></a>
  <div style="clear:both">
  <ul id="v-menu2" class="v-menu">
  <li><a href="p1.html">Technology</a></li>
  <li><a href="p2.html">Design</a></li>
  <li><a href="p3.html">Css Gallery</a></li>
  <li><a href="p4.html">Entertainment</a></li>
  <li><a href="p5.html">Programming</a></li>
  </ul>
</div></td>
</tr>
</table>
</body>
</html>

tom · #14 (**permalink**) 30.11.2010, 11:08

Оооо, спасиба, это частично помогло.

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

Если у каталога нет подкаталогов то в меню он выводися как ссылка на каталог(для это есть свой шаблон), если есть подкатлоги, то в меню этот каталог выводится как раскрывающееся меню с сылками на подкатолиги.(для этого тоже свой шаблон)

на главную меню выводится переменной @leftCatal@, которая подгружает шаблон данного меню

шаблон меню для каталого содержащик подкаталоги(раскрывающеес� � меню):

<div id="divCatId@catalogId@" class="divCat_off">
<table class="tableCat" border="0" cellpadding="0" cellspacing="0">
                    	<tbody>
                        	<tr>
                            	<td class="tdCatHeader">
<div class="divCatTitle"> <img src="../images/myimg/menu_bullet.png" width="4" height="8" />
<a href="#" id="toggle1">@catalogName@</a> ПЕРЕМЕННАЯ ВЫВОДИ ИМЕНА  всех КАТАЛОГОВ
 <ul id="v-menu1" class="v-menu">
  <li >@catalogPodcatalog@</li> ИМЕНА ВСЕХ ПОДКАТАЛОГОВ ДАННОГО КАТАЛОГА
  </ul>

</div>
                                </td>
                            </tr>
</tbody>
                    </table>
                </div>

Теперь не понятно как тут присвоить уникальный ID КАЖДОМУ
@catalogName@
@catalogPodcatalog@ , так как @catalogName@ и @catalogPodcatalog@ выводится в зависимости от количества каталогов и подкаталогов
или может присвоить ID какому-нибудь блоку в котором будут лежать эти переменный , что-бы скрипт срабатывал для всех элементов этого блока?

monolithed · #15 (**permalink**) 30.11.2010, 15:47

Сообщение от tom

Теперь не понятно как тут присвоить уникальный ID КАЖДОМУ

<script type="text/javascript">
window.onload = function(){
    for(var i=1; i<10; ++i){
        var elem = document.createElement('div');
*!*
        elem.id = 'id'+i;
*/!*
        elem.innerHTML = elem.id;
        document.body.appendChild(elem);
    }
};
</script>

Форум

Справочник

Discord чат

Курсы javascript