Dojo Fisheye Example
Written by on December 4th, 2006 in Ajax News.
Richard Sharples has written up his experience mixing Dojo with Roller.
It consists of setting up the Dojo library and then:
Category Changing JS
var url;
if (catname == ‘All’ ) {
url=”$url.home”
} else {
url=”${url.home}category/”+catname
}
window.location.replace ( url );
}
HTML Dojo Component
<div class=”dojo-FisheyeList”
dojo:itemWidth=”110″ dojo:itemHeight=”40″
dojo:itemMaxWidth=”250″ dojo:itemMaxHeight=”90″
dojo:orientation=”horizontal”
dojo:effectUnits=”1″
dojo:itemPadding=”0″
dojo:attachEdge=”top”
dojo:labelEdge=”bottom”
dojo:enableCrappySvgSupport=”false”>
<div class=”dojo-FisheyeListItem” onClick=”selectCategory(’All’);”
dojo:iconsrc=”$IMAGES/cat-All.png”
</div>
<div class=”dojo-FisheyeListItem” onClick=”selectCategory(’About Me’);”
dojo:iconsrc=”$IMAGES/cat-AboutMe.png”>
</div>
<div class=”dojo-FisheyeListItem” onClick=”selectCategory(’Books’);”
dojo:iconsrc=”$IMAGES/cat-Books.png”>
</div>
<div class=”dojo-FisheyeListItem” onClick=”selectCategory(’Roller’);”
dojo:iconsrc=”$IMAGES/cat-Hacking.png”>
</div>
<div class=”dojo-FisheyeListItem” onClick=”selectCategory(’General’);”
dojo:iconsrc=”$IMAGES/cat-General.png”>
</div>
<div class=”dojo-FisheyeListItem” onClick=”selectCategory(’Java’);”
dojo:iconsrc=”$IMAGES/cat-Java.png”>
</div>
<div class=”dojo-FisheyeListItem” onClick=”selectCategory(’Home Life’);”
dojo:iconsrc=”$IMAGES/cat-HomeLife.png”>
</div>
<div class=”dojo-FisheyeListItem” onClick=”selectCategory(’Gadgets’);”
dojo:iconsrc=”$IMAGES/cat-Gadgets.png”>
</div>
<div class=”dojo-FisheyeListItem” onClick=”selectCategory(’W3′);”
dojo:iconsrc=”$IMAGES/cat-W3.png”>
</div>
</div>
</div></div>
Source: Ajaxian
Original Article: http://ajaxian.com/archives/dojo-fisheye-example
