摘要:Dojo-Dojox相片web撥放功能
<script type="text/javascript" src="/dojo/dojo/dojo.js" djConfig="isDebug:true,parseOnLoad: true,bindEncoding:'UTF-8'"></script>
<style type="text/css">
@import "/dojo/dojox/image/resources/image.css";
</style>
<script type="text/javascript">
dojo.require("dojox.image.Gallery");
dojo.require("dojo.data.ItemFileReadStore");
dojo.require("dojo.parser");
</script>
<body class="nihilo" bgcolor="#000000">
<font size=20 color=red><p align="center">相片DEMO</P></font>
<div jsId="imageItemStore" dojoType="dojo.data.ItemFileReadStore"
url="/dojo/Dojox/Image/images.json"></div>
<div id="gallery2" dojoType="dojox.image.Gallery"
imageWidth="300" imageHeight="200">
<script type="dojo/connect">
var itemRequest = {
query: {},
count: 20
};
var itemNameMap = {
imageThumbAttr: "thumb",
imageLargeAttr: "large"
};
this.setDataStore(imageItemStore, itemRequest, itemNameMap);
</script>
</div>
</body>
images.json:
{ items: [
{
"thumb":"/image/extraWide.jpg",
"large":"/image/extraWide.jpg",
"title":"照片1",
"link":"http://www.google.com.tw"
},
{
"thumb":"/image/imageHoriz.jpg",
"large":"/image/imageHoriz.jpg",
"title":"照片2",
"link":"http://www.google.com.tw"
},
{
"thumb":"/image/imageHoriz2.jpg",
"large":"/image/imageHoriz2.jpg",
"title":"照片3",
"link":"http://www.google.com.tw"
},
{
"thumb":"/image/imageVert.jpg",
"large":"/image/imageVert.jpg",
"title":"照片4",
"link":"http://www.google.com.tw"
},
{
"large":"/image/square.jpg",
"thumb":"/image/square.jpg",
"link" :"/image/square.jpg",
"title":"照片5"
}
]}