5

我想使用 iframejQuery.animate外部的链接导航到 iframe 内的 div。这是我使用的代码:

function scrollToAnchorIframe(aid){
  var aTag = window.frames['myFrame'].document.getElementById(aid);
  $('html,body').animate({scrollTop: aTag.offset().top - 62},'slow');
}

但是,它不起作用,记录错误“ Object [object HTMLElement] has no method 'offset'”。有没有办法获得 id 的偏移量以使其工作?

更新(已解决):这就是我现在使用的代码:

function scrollToAnchorIframe(aid){
  var aTag = window.frames['myFrame'].document.getElementById(aid);
  jQuery('html,body').animate({scrollTop: $(aTag).offset().top + $("#myFrame").offset().top - 62},'slow');
}
4

2 回答 2

4

aTag是 DOM 元素,使其成为 jQuery 对象

$('html,body').animate({scrollTop: $(aTag).offset().top - 62},'slow');
于 2013-06-13T20:51:23.273 回答
0

如果 iframe 放在容器框中,这里有一个更新,以便从父页面容器向上/向下导航到 iframe 的书签锚点(注意:“window.frames”与 FF 浏览器有一个已知的兼容性错误,所以我将改用“contentWindow”):

function iframeBookmark(anchor) {
mytag = document.getElementById("iframeID").contentWindow.document.getElementById(anchor);
pos1 = $(mytag).offset().top;
pos2 = $("#iframeID").offset().top;
if (pos2 > pos1) {
    $("#iframeContainerID").animate({scrollTop: pos2 - (pos2 - pos1) },'slow');
    }
else {
    $("#iframeContainerID").animate({scrollTop: pos2 + (pos1 - pos2)  },'slow');
    }
}

因此,当我们从父 HTML 调用该函数时,向上/向下滚动取决于 iframe 当前位置:

 <a onclick="iframeBookmark('iframeBookmarkID')">...</a>

...其中“iframeBookmarkID”是 iframe 页面中书签锚点的 ID。

于 2013-09-07T20:40:52.090 回答