jquery-easyui中的菜单(仿WIN7)

介绍一下EASYUI 中的菜单,这个菜单同以前的DMENU不同,经过了重新设计,仿照WIN7的菜单风格。先看张截图:


jquery-easyui中的菜单(仿WIN7)
菜单的设计是在标记中定义的,看看菜单的代码:

	<div id="mm" style="width:120px;">
		<div onclick="javascript:alert('new')">New</div>
		<div>
			<span>Open</span>
			<div style="width:150px;">
				<div><b>Word</b></div>
				<div>Excel</div>
				<div>PowerPoint</div>
				<div>
					<span>M1</span>
					<div style="width:120px;">
						<div>sub1</div>
						<div>sub2</div>
						<div>
							<span>Sub</span>
							<div style="width:80px;">
								<div onclick="javascript:alert('sub21')">sub21</div>
								<div>sub22</div>
								<div>sub23</div>
							</div>
						</div>
						<div>sub3</div>
					</div>
				</div>
			</div>
		</div>
		<div icon="icon-save">Save</div>
		<div class="menu-sep"></div>
		<div>Exit</div>
	</div>

怎么使得这个标记变成菜单,执行以下代码:

$('#mm').menu();

这是的菜单是不可见的,要显示时需要执行show方法,隐藏时则执行hide方法,下面的显示菜单的代码:

				$('#mm').menu('show',{
					left:100,
					top:200
				});

 

 

你可能感兴趣的:(JavaScript,jquery,Excel)