• Binary revolution
    -

    VIP
    5
  • Forex  -

  • TOKYO GAP


  • Master Trend

    300 1000 . .
  • 6000$





!!!

 

MooTools 1.4.5

: 18.01.2014
: 
: bulatlab.ru

,  , !

 

, , MooTools – 1.4.5. -, ( ) - , . , , .

 

, HTML-:

<!DOCTYPE HTML>
<html>
<head>
	<link rel="stylesheet" type="text/css" href="2.css" media="screen"/>
	<script src="mootools-core-1.4.5-full-nocompat(1).js"></script>
	<script src="mootools-more-1.4.0.1(1).js"></script>
	<script>
		//     DOM
		window.addEvent('domready', function(){
		new Fx.Accordion($('accordion'), '#accordion h3', '#accordion .content',{
			'onActive': function(tog, el) { tog.addClass('active'); },
			'onBackground': function(tog, el) { tog.removeClass('active'); },
			'fixedHeight': 200,
			'show': 2});
		});				
	</script>
</head>
<body>
	<div id="accordion">
		<h2></h2>
		<h3 class="mainlevel"> 1</h3>
		<div class="content">
     		<a href=""> 1</a>
			<a href=""> 2</a>
			<a href=""> 3</a>
			<a href=""> 4</a>
			<a href=""> 5</a>
			<a href=""> 6</a>
		</div>
  
		<h3 class="mainlevel"> 2</h3>
  		<div class="content">
     		<a href=""> 1</a>
			<a href=""> 2</a>
			<a href=""> 3</a>
			<a href=""> 4</a>
			<a href=""> 5</a>
			<a href=""> 6</a>
     		<a href=""> 7</a>
			<a href=""> 8</a>
		</div>
  
		<h3 class="mainlevel"> 3</h3>
		<div class="content">
      	<a href=""> 1</a>
			<a href=""> 2</a>
			<a href=""> 3</a>
			<a href=""> 4</a>
			<a href=""> 5</a>
		</div>
		
		<h3 class="mainlevel last"> 4</h3>
		<div class="content">
     		<a href=""> 1</a>
			<a href=""> 2</a>
			<a href=""> 3</a>
			<a href=""> 4</a>
			<a href=""> 5</a>
			<a href=""> 6</a>
		</div>
		
	</div>
</body>
</html>

 

, , – . – . . h3, – .

 

. , . , , :

#accordion  {
  width: 192px;
  background: #F5F5F5 url('module_c.gif') no-repeat bottom left;
}
#accordion  h2{
	font-family:"Trebuchet MS";
	font-size:13px;
	background:url('module_i2.png') no-repeat top left;
	text-align:center;
	color:#468;
	padding:8px 0;
	margin:0;
}
#accordion h3 {
   cursor: pointer;
   padding:0;
	margin:0;
	padding: 0px 6px;
	font-weight:normal;
	color: #567;
}
#accordion h3:hover{
	 color:#28E;
}
.mainlevel{
	height: 26px;
	background: url('quick_ba.jpg') no-repeat top left;
	line-height: 26px;
	font-size: 12px;
}
.mainlevel.last{
	background: url('quick_la.jpg') no-repeat top left;
}
.mainlevel.active{
	background: url('quick_ac.jpg') no-repeat top left;
	color:#000;
}
#accordion .content {
   height:200px;
}
#accordion .content  a{
	display:block;
	text-decoration: none;
	color: #262626;
	padding-left:13px;
	border-bottom: 1px solid #e1e1ef;
	margin: 0px 2px;
	font-size: 12px;
}
#accordion .content  a:hover{
  	color:#28E;
	background:#fff;
}

 

! !

 

  

 

 
: 2243
: 0
: (0)