| sitelink1 | |
|---|---|
| sitelink2 | |
| sitelink3 | |
| extra_vars4 | |
| extra_vars5 | |
| extra_vars6 |
<html>
<head>
// Dojo 라이브러이 임포트
<script language="JavaScript" type="text/javascript"
src="dojo-0.3.1-ajax/dojo.js">
</script>
<script>
// 사용할 피쉬 리젯을 로드한다.
dojo.require("dojo.widget.FisheyeList");
// 로드된 리젯의 아이템들에 이벤트 함소
function load_app(id){
alert('Icon '+id+' was clicked');
}
</script>
<title>Usage of FisheyeList & FisheyeItem Widgets from Dojo Toolkit</title>
</head>
<body>
// 피쉬 위젯이 로드되는 Div.
// dojo 속성들을 사용해 전체 위젯의 크기와 효과들을 설정한다.
<div class="dojo-FisheyeList"
dojo:itemWidth="50" dojo:itemHeight="50"
dojo:itemMaxWidth="200" dojo:itemMaxHeight="200"
dojo:orientation="horizontal"
dojo:effectUnits="2"
dojo:itemPadding="10"
dojo:attachEdge="top"
dojo:labelEdge="bottom"
dojo:enableCrappySvgSupport="false"
>
// 피쉬 리젯의 아이템 들로서 이미지 종류와 특성들을 설정할 수 있다.
<div class="dojo-FisheyeListItem" onmouseover="load_app(1);"
dojo:iconsrc="dojo-0.3.1-ajax/demos/widget/images/icon_browser.png"
dojo:caption="Browser" >
</div>
<div class="dojo-FisheyeListItem" onmouseover="load_app(2);"
dojo:iconsrc="dojo-0.3.1-ajax/demos/widget/images/icon_calendar.png"
dojo:caption="Calendar" >
</div>
<div class="dojo-FisheyeListItem" onmouseover="load_app(3);"
dojo:iconsrc="dojo-0.3.1-ajax/demos/widget/images/icon_email.png"
dojo:caption="Email" >
</div>
<div class="dojo-FisheyeListItem" onmouseover="load_app(4);"
dojo:iconsrc="dojo-0.3.1-ajax/demos/widget/images/icon_texteditor.png"
dojo:caption="Text Editor" >
</div>
<div class="dojo-FisheyeListItem" onmouseover="load_app(5);"
dojo:iconsrc="dojo-0.3.1-ajax/demos/widget/images/icon_update.png"
dojo:caption="Update" >
</div>
</div>
</body>
</html>
