javascript - Windows 8 デスクトップで createPeekAnimation 関数のアニメーション オブジェクトの offsetArray の値を変更するにはどうすればよいですか?

Question

Windows 8 アプリケーションで Peek Animation 機能を使用しようとしています。私のコードではrunHomeScreenUpdates、特定の間隔でホーム画面のタイルを更新する関数を呼び出しています。

以前は、正常に機能していたcreateAddToListAnimation関数を使用していました。しかし、小さいタイルには Peek Animation を使用したいと思います。MSDN の例で説明されているように、2 つの画像オブジェクトを渡します。前述のように「スタイルトッププロパティ」を変更して画像のオフセットも編集しましたが、機能しません。ここでのアニメーション オブジェクト「ピーカニメーション」はオフセット値を取得しません。ブレークポイントで確認したところ、アニメーション オブジェクトのオフセット配列の値が「0」になっていました。この offsetArray 値を変更するにはどうすればよいですか?

function peekTile(tile1, tile2) {
  // Create peek animation
  var peekAnimation = WinJS.UI.Animation.createPeekAnimation([tile1, tile2]);
  // Reposition tiles to their desired post-animation position
  tile1.style.top = "-120px";
  tile2.style.top = "0px";
  // Execute animation
  peekAnimation.execute();
  return "success";
}
function runHomeScreenUpdates(obj) {
  initHomeScreenUpdates();
  var updateInterval = obj.data("updateInterval");
  var localStorageKey = obj.data("localStorageKey");
  clearInterval($(obj).data("autoUpdateInterval"));
  var data = localStorage.getItem(localStorageKey);
  // for bigger tiles I used create add to list animation. it works fine.
  if (WinJS.Navigation.location.indexOf("hub.html") >= 0) {
    var interval = setInterval(function () {
      var index = $(obj).data("index");
      if (index == 22 || index == 23) {
        var lists = JSON.parse(localStorage.getItem("lists"));
        lists = lists[localStorage.getItem("selectedCity")] || {};
        if (lists.count > 0) {
          if (sessionStorage.getItem("listIndex") == null || sessionStorage.getItem("listIndex") >= (lists.count - 1)) {
            sessionStorage.setItem("listIndex", 0);
          } else {
            sessionStorage.setItem("listIndex", parseInt(sessionStorage.getItem("listIndex")) + 1);
          }
          var div = $(obj).find(".largeTileTextTemplateMedText");
          var newDiv = document.createElement("div");
          newDiv.innerHTML = lists[sessionStorage.getItem("listIndex")].text;
          newDiv.className = "largeTileTextTemplateMedText";
          var affected = div.get(0);
          // Step 1: Create the animation object and save the result
          var animation = WinJS.UI.Animation.createAddToListAnimation(newDiv, affected);
          // Step 2: Insert the element given in the added parameter immediately before
          // the element given in the affected parameter. This causes both elements to move.
          affected.parentNode.insertBefore(newDiv, affected);
          // Step 3: Execute the animation
          animation.execute().then(function () {
            myData4[index].text = lists[sessionStorage.getItem("listIndex")].text;
            myData4[index].id = lists[sessionStorage.getItem("listIndex")].id;
            hubList = new WinJS.Binding.List(myData4);
            groupedItems = hubList.createGrouped(function (item) { return item.group.key; }, function (item) { return item.group; });
          });
          $(affected).remove();
        }
      } else {
      // for the smaller tiles i want to use the peek animation!! this part--
        var img = $(obj).find(".foodshot");
        var foodshots = JSON.parse(localStorage.getItem("foodshots"));
        foodshots = foodshots[localStorage.getItem("selectedCity")] || {};
        if (foodshots.count > 0) {
          if (sessionStorage.getItem("foodshotIndex") == null || sessionStorage.getItem("foodshotIndex") >= (foodshots.count - 1)) {
            sessionStorage.setItem("foodshotIndex", 0);
          } else {
            sessionStorage.setItem("foodshotIndex", parseInt(sessionStorage.getItem("foodshotIndex")) + 1);
          }
          var r = sessionStorage.getItem("foodshotIndex");
          var newsrc = foodshots[r].url;
          var newimg = document.createElement("img");
          newimg.setAttribute("src", newsrc);
          newimg.className = "foodshot";
          var affected = img.get(0);
          affected.style.top = "0px";
          newimg.style.top = "120px";
          var check = peekTile(affected, newimg);
          if(check == "success"){
            myData4[index].cuisineID = foodshots[r].cuisine_id;
            myData4[index].cuisine = foodshots[r].cuisine;
            myData4[index].picture = foodshots[r].url;
            $(obj).find(".foodshot-text").get(0).innerHTML = foodshots[r].cuisine;
            hubList = new WinJS.Binding.List(myData4);
            groupedItems = hubList.createGrouped(function (item) { return item.group.key; }, function (item) { return item.group; });
          };
          $(affected).remove();
        }
      }
    }, updateInterval);
    $(obj).data("autoUpdateInterval", interval);
  }

ホーム画面で。アニメーションを実行した後、画像が表示されません。