Dojo-Dojox相片web撥放功能

摘要: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"
 }
]}