Comment obtenir scrollTop d'une iframe
scrollTop de jQuery retourne null quand window est une iframe. Est-ce que quelqu'un a pu trouver comment obtenir scrollTop d'une iframe?
plus d'info:
mon script tourne dans l'iframe elle-même, la fenêtre parent est sur un autre domaine, donc je ne peux pas accéder à L'ID de l'iframe ou quelque chose comme ça
7 réponses
Vous pouvez définir scrollTop
en utilisant cette configuration:
$("html,body").scrollTop(25);
alors vous pouvez essayer de le faire comme ceci:
$("html,body").scrollTop();
parce que différents navigateurs paramétrent le scrollTop
sur différents éléments (corps ou html).
à Partir de la scrollTo plugin:
mais cela échouera probablement encore dans certains navigateurs. Voici la partie du code source de Ariel Flesher de scrollTo plugin pour jQuery:
// Hack, hack, hack :)
// Returns the real elements to scroll (supports window/iframes, documents and regular nodes)
$.fn._scrollable = function(){
return this.map(function(){
var elem = this,
isWin = !elem.nodeName || $.inArray( elem.nodeName.toLowerCase(), ['iframe','#document','html','body'] ) != -1;
if( ! isWin ) {
return elem;
}
var doc = (elem.contentWindow || elem).document || elem.ownerDocument || elem;
return $.browser.safari || doc.compatMode == 'BackCompat' ?
doc.body :
doc.documentElement;
});
};
vous pouvez alors courir:
$(window)._scrollable().scrollTop();
pour déterminer jusqu'à quel point l'iframe a dégringolé.
j'ai trouvé cette question en essayant de mettre scrollTop dans une iframe... pas exactement votre question (vous vouliez obtenir) Mais voici une solution à l'intérieur d'iframes pour les gens qui finissent ici en essayant de mettre.
Si vous voulez faire défiler vers le haut de la page cela ne fonctionne PAS à l'intérieur d'une iframe:
$("html,body").scrollTop(0);
Toutefois, cela va fonctionner:
document.getElementById("wrapper").scrollIntoView();
Ou l'équivalent avec jQuery:
$("#wrapper")[0].scrollIntoView();
pour ce balisage (contenu à l'intérieur un iframe):
<html>
<body>
<div id="wrapper">
<!-- lots of content -->
</div>
</body>
</html>
Bon vieux javascript:
scrollTop = document.getElementById(IFRAME_ID).contentWindow.document.body.scrollTop;
$('#myIframe').contents().scrollTop(0);
ne fonctionne Qu'avec" 0 " comme paramètre
ou utiliser
sample.showLoader = function() {
// show cursor wait
document.getElementsByTagName('body')[0].style.cursor = 'wait';
var loader = $('#statusloader');
// check if we're runnign within an iframe
var isIframe = top !== self;
if (isIframe) {
var topPos = top.pageYOffset + 300;
// show up loader in middle of the screen
loader.show().css({
top : topPos,
left : '50%'
});
} else {
// show up loader in middle of the screen
loader.show().css({
top : '50%',
left : '50%'
});
}
};
je sais je suis en retard pour le jeu ici, mais j'essayais de comprendre cela pour une longue liste sur mobile. scrollTop () ne fonctionnait pas pour moi en raison de conflits entre domaines (et je n'avais pas accès à la fenêtre parent), mais changer la hauteur a fait:
$('#someClickableElementInIFrame').on('click', function(e){
$("html body").animate({
'height' : "0"
}, {
complete: function(){
$("html body").css({
'height' : "auto"
})
}
})
});