javascript - 如何将共享按钮放置在游戏的左上角而不是 View ？

Question

我正在使用 Construct 2 游戏引擎创建一个 html 5 游戏，我想集成名为 AddThis 的第 3 方共享选项。通过在 html 文件中插入脚本来工作。一切都在显示，但我很难将共享按钮定位在游戏的左上角，而不是在浏览器上。我尝试使用 CSS 选项来定位元素，但我无法使其工作。将此共享元素保留在 Index.html 而不是 game.html 中很重要，因此共享链接指向 index.html 而不是 game.html。这是页面现在的样子 Preview page (共享按钮需要 5-15 秒才能加载)

这是导出的 game

任何帮助将不胜感激!

Answer 1

您需要获取 iframe 和 iframe canvas 的 offset()，然后从两者获取总的顶部和左侧。现在你必须将顶部和左侧应用到 #addthis 就像

$(function(){
    function setSocialIconPosistion(c) {
      var o = $('#main iframe').contents().find('#c2canvas').offset(),//get canvas offset
          po = $('#main iframe').offset(),//get iframe offset
          t = o.top + po.top, // get total top of both offset
          l = o.left + po.left;// get total left of both offset
      // now apply it to your social icon container
      $('#addthis').css({
         'top': t + 'px',
         'left': l + 'px'
      });
    }
    // bind on resize of window
    $(window).resize(function () {
      setSocialIconPosistion();
    });
    // call when page loads
    setSocialIconPosistion();
});

将以上代码添加到您的 index.html 页面。