dojo实现一个菜单

今天做了一个下午网页,中午觉都没有睡.发现菜单做得挺难看的,很是郁闷....

索性不做了,打开dojo的demo一看发现里面的有点炫的菜单.于是引用了下

引入dojo包为dojojs包(跟以前的文章一样引入,如不清楚就看前篇) ......

<! DOCTYPEHTMLPUBLIC " -//W3C//DTDHTML4.01//EN " " http://www.w3.org/TR/html4/strict.dtd " >
< html >
< head >

< title > FisheyeListWidgetDemo </ title >

< scripttype = " text/javascript " >
var djConfig = ... {isDebug:true,debugAtAllCosts:false} ;
</ script >
< scripttype = " text/javascript " src = " dojojs/dojo.js " ></ script >
< scripttype = " text/javascript " >
dojo.require( " dojo.widget.* " );
</ script >

< script >
function load_app(url) ... {
location.href=url;
}
</ script >

< style >

.dojoHtmlFisheyeListBar ... {
margin:0auto;
text-align:center;
}

.outerbar ... {

text-align:center;
position:absolute;
left:0px;
top:0px;
width:100%;
}

body ... {
font-family:Arial,Helvetica,sans-serif;
padding:0;
margin:0;
}

.page ... {
padding:60px20px20px20px;
}

</ style >
</ head >
< body >

< divclass = " outerbar " >

< divdojoType = " FisheyeList "
itemWidth = " 50 " itemHeight = " 50 "
itemmaxWidth = " 200 " itemmaxHeight = " 200 "
orientation = " horizontal "
effectUnits = " 2 "
itemPadding = " 10 "
attachEdge = " top "
labelEdge = " bottom "
enableCrappySvgSupport = " false "
>

< divdojoType = " FisheyeListItem " onClick = " load_app('http://blod.csdn.net/gxzheng1985'); "
iconsrc = " images/icon_browser.png " caption = " Webbrowser " >
</ div >

< divdojoType = " FisheyeListItem " onClick = " load_app('http://blod.csdn.net/gxzheng1985'); "
iconsrc = " images/icon_calendar.png " caption = " 留言板 " >
</ div >

< divdojoType = " FisheyeListItem " onClick = " load_app('http://blod.csdn.net/gxzheng1985'); "
iconsrc = " images/icon_email.png " caption = " Email " >
</ div >

< divdojoType = " FisheyeListItem " onClick = " load_app('http://blod.csdn.net/gxzheng1985'); "
iconsrc = " images/icon_texteditor.png " caption = " TextEditor " >
</ div >

< divdojoType = " FisheyeListItem " onClick = " load_app('http://blod.csdn.net/gxzheng1985'); "
iconsrc = " images/icon_update.png " caption = " SoftwareUpdate " >
</ div >

< divdojoType = " FisheyeListItem " onClick = " load_app('http://blod.csdn.net/gxzheng1985'); "
iconsrc = " images/icon_users.png " caption = " Users " >
</ div >
</ div >
</ BODY >
</ HTML >

引入图片 可以看到效果...

鼠标经过之后可以看到