2013-06-13 10 views
5

Chcę przejść do elementu div wewnątrz elementu iframe za pomocą jQuery.animate z linku poza ramką iframe. Jest to kod używam:Jak zastosować "offset" do elementu wewnątrz elementu iframe?

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

Jednak to nie działa, rejestrowanie błąd „Object [object HTMLElement] has no method 'offset'”. Czy istnieje sposób na uzyskanie przesunięcia identyfikatora, aby działał?

Update (rozwiązać): To jest kod używam teraz:

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

Otrzymujesz ten błąd, ponieważ obiekt nie jest obiektem jQuery. To jest HTMLElement. Wypróbuj '$ (aTag) .offset()' lub zawiń 'window.frames ['myFrame']. Document.getElementById (aid);' in a $() ' – crush

+0

Zauważ, że nie możesz używać programowania X-Frame, chyba że pracujesz w tej samej domenie z tym samym protokołem. – ARMBouhali

Odpowiedz

4

aTag jest elementem DOM, sprawiają, że jQuery obiekt

$('html,body').animate({scrollTop: $(aTag).offset().top - 62},'slow'); 
+0

Dziękujemy! To wystarczyło. Oto pełny kod, którego teraz używam: 'function scrollToAnchorIframe (aid) { var aTag = window.frames ['myFrame']. Document.getElementById (aid); jQuery ('html, body'). Animate ({scrollTop: $ (aTag) .offset(). Top + $ ("# myFrame"). Offset(). Top - 62}, 'slow'); } ' – Georg

+0

@Georg Pozdrawiam !! –

+0

@Mohammad Adil: Dzięki człowieku .. Działa bardzo dobrze. –

0

Jeśli iframe jest umieszczany wewnątrz pojemnika box, tutaj jest aktualizacja, aby nawigować w górę/w dół do zakotwiczenia zakładki iframe z kontenera strony nadrzędnej (uwaga: "window.frames" ma znany błąd zgodności z przeglądarką FF, więc zamiast tego użyję "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'); 
    } 
} 

Więc, kiedy nazywamy funkcję z HTML dominującej, w górę/w dół do przewijania zależy iframe Aktualna pozycja:

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

... gdzie „iframeBookmarkID” jest identyfikatorem zakładki -anchor na stronie iframe.

Powiązane problemy