Redimensionner l'iframe au contenu avec Jquery
Je suis en train de redimensionner une iframe dynamicly pour s'adapter à son contenu. Pour ce faire, j'ai un morceau de code:
$("#IframeId").height($("#IframeId").contents().find("html").height());
Il ne marche pas. C'est à cause de problème de domaines? Comment puis-je le faire tenir? Veuillez prendre un coup d'oeil au Violon: JsFiddle
ps j'ai mis le html et le corps du lien height:100%;
source d'informationauteur Youss
Vous devez vous connecter pour publier un commentaire.
Vous avez juste besoin d'appliquer votre code sur l'iframe
load
de l'événement, de sorte que la hauteur est déjà connu à l'époque, le code suivant:Voir le travail démo . Cette démo œuvres sur jsfiddle que j'ai mis l'iframe par une url dans le même domaine que le jsfiddle résultat de l'iframe, qui est, le
fiddle.jshell.net
domaine.Mise à JOUR:
@Youss:
Il semble que votre page pour une raison étrange, de ne pas obtenir la hauteur du corps droit, donc essayez d'utiliser la hauteur des principaux éléments au lieu de cela, comme ceci:
Ne sais pas pourquoi @Nelson solution qui ne fonctionne pas dans Firefox 26 (Ubuntu), mais la suite de Javascript-jQuery solution semble fonctionner dans Chrome et Firefox.
En permanence, cette redimensionne toutes les images sur une page donnée.
Testé avec jQuery 1.10.2.
À l'aide de
$('iframe').on( 'load', ...
ne fonctionne que par intermittence. Notez que la taille doit d'abord être réglé sur0
pixels en hauteur si c'est pour réduire au-dessous de la valeur par défautiframe
hauteur dans certains navigateurs.Ce que vous pouvez faire est la suivante:
À l'intérieur de l'iFrame utilisation document.parent.setHeight(myheight) pour régler la hauteur à l'intérieur de l'iFrame à la mère. Ce qui est permis, car il est un enfant de contrôle. Appeler une fonction de la société mère.
Dans le parent de vous faire une fonction setHeight(iframeheight) qui redimensionne l'iFrame.
Voir aussi:
Comment puis-je mettre en œuvre la Croix de Domaine de l'URL d'Accès à partir d'une Iframe à l'aide de Javascript?
Juste le faire sur la balise HTML, fonctionne parfaitement
Ajuster la hauteur de l'iframe, de la charge et la redimensionner, basé sur son corps hauteur.
Que la réponse à la question en utiliser une déjà obsolète jquery (charge a été supprimée et remplacée par .sur('load',function(){}), ci-dessous est le code le plus récent pour la réponse dans la question.
Noter que j'utilise le scrollHeight et scrollWidth, qui, je pense, se chargent beaucoup plus agréable qu'à l'aide de la Hauteur et de la Largeur comme la réponse fournie. Il va totalement s'adapter, sans faire défiler plus.