转换动画的KendoMobile scrollview问题

Question

我目前正在使用KendoMobile开发WebApp。

我使用scrollView显示信息栏，如下图所示：

当我点击标记时出现问题。 我编写了一个函数，用于更改scrollview的页面以匹配我单击的标记。

以下是该方法的代码：

google.maps.event.addListener(markerObj, 'click', function() {
    var page = fournisseursArrayIndexOf(markerObj.data["ID"]);
    console.log("marker title : " + markerObj.title + " / footer page : " + page);

    var footer  = $("#footer").data("kendoMobileScrollView");
    var curpage = footer.page;

    markers[curpage].setIcon(normalImg);
    markerObj.setIcon(selectedImg);

    footer.scrollTo(page);
    //map.panTo(markerObj.position);
});

我读了here如果我使用带有单个参数的scrollTo方法（我要显示的页面索引），默认情况下会有一个过渡动画。 但没有任何反应，我的意思是页面确实发生了变化，但没有动画。

我搜索了剑道论坛，但我找到的唯一主题是this one，但它与我想要的完全相反：他希望在我想要的时候删除动画。 但这对我有帮助，因为这意味着可以制作动画。

有人知道这个问题的解决方案吗？

Answer 1

问题解决了！排序......

我通过修改KendoMobileScrollView的代码测试了很多东西，我发现在调用scrollTo方法时应该显示的动画不适用于填充模板的scrollview。

因此，如果有人遇到同样的问题：您必须编写一个循环来创建滚动视图的页面并将其插入DOM中。

看起来像这样：

var htmlToAppen = "<div data-role=\"page\>"";

for(var i = 0 ; i < yourObjectsArray.length ; i++) {
    var curObj = yourObjectsArray[i];

    htmlToAppen += "<div> objName : " + curObj.name + "</div>";

    htmlToAppen += "</div>"; 
}

$("#yourScrollDiv").append(htmlToAppend);
$("#yourScrollDiv").kendoMobileScrollView({
    enablePager : false
});