dojo 1.9 dojox / widget / Rotator动态图像

时间:2015-08-14 11:48:36

标签: javascript image dojo slideshow pojo

dojox.widget.Rotator在DojoToolkit 1.9中非常陈旧。似乎没有任何更新。

我尝试使用dojoToolkit 1.9创建一个图像小部件旋转器。但是我可以这样做,因为在dojo 1.9中似乎无法做到这一点。

从dojo文档中可以看出:

dojo.require("dojox.widget.Rotator");
dojo.require("dojox.widget.rotator.Fade");
dojo.ready(function(){
// add a 3rd pane
dojo.create("div", { className: "pane", innerHTML: "dynamically added Pane" }, "myRotator2");

new dojox.widget.Rotator(
    {
        transition: "dojox.widget.rotator.fade"
    },
    dojo.byId("myRotator2")
  );
});

它完全是< 1.7风格,有没有一个dojo 1.9的例子?

我需要它来从POJO生成一个小部件旋转器(从数据库中获取。)

我试过这样的事情:

require(["dojo/dojo","dojo/dom","dojo/request/xhr","dojo/_base/array","dojo/_base/json","dojo/dom-construct","dojo/_base/connect", "dojox/widget/Rotator", "dojox/widget/rotator/Fade","dojo/domReady!"], function(dojo,dom,xhr,array,json,domConst){
var dataJson = {siteId:siteId};
var imgholdernode = dom.byId("imgholder");
/*imgholdernode.innerHTML = siteId;*/
xhr("getFileMinisByCustomerNSite",{
    handleAs: "json",
    query:dataJson,
}).then(function(data){
    if (data.length>0){
        var imgRotator = new dojox.widget.Rotator({id:"imgRotator",transition: "dojox.widget.rotator.fade"});
        domConst.place(imgRotator,imgholdernode);
        array.forEach(data,function(item,i){
            domConst.create("img", {"className": "pane","id": item.fileId, "src": "data:"+item.fileType+";base64,"+item.thumbnail}, "imgRotator");
        });
        domConst.create("button",{"onclick":"connect.publish('imgRotator/rotator/control',[prev]);",innerHTML: "Prev",type: "button"});
        domConst.create("button",{"onclick":"connect.publish('imgRotator/rotator/control',[next]);",innerHTML: "Next",type: "button"});
        /*imgholdernode.innerHTML = data.length;*/
    }else{
        imgholdernode.innerHTML = "No image available.";
    }
  });
});

但它永远不适合我。任何人都有经验,请与我分享!

0 个答案:

没有答案