mozilla
Vos résultats de recherche

    <iframe> Redirection 1

    Résumé

    L'élément HTML <iframe> (pour inline frame) représente un contexte de navigation imbriqué, ce qui se traduit par l'intégration d'une page HTML dans la page actuelle. Chaque contexte de navigation possède son propre historique de session et son document actif. Le contexte de navigation entourant le contenu intégré est appelé contexte de navigation parent. La fenêtre de navigation est généralement le contexte de navigation de plus haut-niveau (c'est à dire celui n'ayant pas de parent).

    • Catégories de contenu Contenu de flux, contenu phrasé, contenu intégré, contenu interactif, contenu palpable.
    • Contenu autorisé Cas spécial, voir la syntaxe et l'exemple
    • Omission de balises Aucune, tant le tag d'ouverture que de fermeture est obligatoire
    • Élément parents autorisés Tout élément acceptant du contenu intégré
    • Interface DOM HTMLIFrameElement.

    Attributs

    Cet élément inclut les attributs globaux.

    align Obsolète depuis HTML4.01, Obsolète depuis HTML5
    L'alignement de cet élément par rapport au contexte qui l'entoure.
    allowfullscreen
    Si cet attribut vaut true, l'élément pourra être affiché en mode plein écran en appelant la méthode element.mozRequestFullScreen(). S'il n'est pas renseigné, l'élément ne pourra pas être affiché en mode plein écran.
    frameborder HTML 4 seulement
    Si cet attribut vaut 1 (la valeur par défaut), le navigateur affichera un cadre (trait) entre cet élément et ceux qui l'entourent. S'il vaut 0, le navigateur ne dessinera pas de cadre autour de l'élément.
    height
    Indique la hauteur de l'élément. En HTML5, elle est exprimée en pixels CSS. En HTML 4.01 elle est exprimée en pixels ou par pourcentage.
    longdesc HTML 4 seulement
    Un URI pour une description étendue du contenu de l'élément. Suite à un usage incorrect généralisé, cet attribut ne doit plus être considéré comme étant utile par les navigateurs non-graphiques.
    marginheight HTML 4 seulement
    L'espace (en pixels) entre le contenu de l'élément et ses marges hautes et basses.
    marginwidth HTML 4 seulement
    L'espace (en pixels) entre le contenu de l'élément et ses marges droites et gauches.
    mozallowfullscreen
    L'attribut allowfullscreen doit être utilisé à la place de celui-ci. Dans la version 9.0 de Gecko et les versions ultérieures, cet attribut peut être fixé à true si l'élément peut être affiché en mode plein écran avec l'appel de la méthode element.mozRequestFullScreen(). S'il n'est pas renseigné, l'élément ne pourra pas être affiché en mode plein écran.
    webkitallowfullscreen
    L'attribut allowfullscreen doit être utilisé à la place de celui-ci. À partir de la version 17 de Chrome, cet attribut peut être fixé à true si l'élément peut être affiché en mode plein écran avec l'appel de la méthode element.webkitRequestFullScreen(). Si cet attribut n'est pas renseigné, l'élément ne pourra pas être affiché en mode plein écran.
    mozapp Only available on Firefox OS
    Pour les éléments <iframe> intégrant une application web, cet attribut représent l'URL du manifeste d'application. Cela permet de s'assurer que l'application est chargée avec les autorisations nécessaires. Voir l'utilisation de l'API Browser pour plus de détails. Disponible à partir de Gecko 13.0.
    mozbrowser Only available on Firefox OS
    Indique que l'élément doit être affiché comme étant au plus haut niveau, celui de la fenêtre du navigteur. Cela signifie que window.top, window.parent, window.frameElement, ... ne reflèteront pas la hiérarchie de cet élément. Cela permet par exemple d'implémenter l'interface utilisateur d'un navigateur web en n'utilisant seulement que des technologies web grâce aux autorisations adéquates. Voir l'utilisation de l'API Browser pour plus de détails. Disponible à partir de Gecko 13.0.
    name
    Un nom pour désigner le contexte de navigation intégré. La valeur de cet attribut pourra être utilisée comme valeur de l'attribut target d'un élément <a> ou <form> ou comme valeur de l'attribut formtarget d'un élément <input> ou <button>.
    remote Only available on Firefox OS
    Charge la page de l'élément dans un processus séparé.
    scrolling HTML 4 seulement
    Attribut indiquant si le navigateur doit fournir une barre de défilement (ou autre chose permettant le défilement de la page) pour l'élément. Il peut valoir :
    • auto : fournira une barre de défilement seulement si nécessaire
    • yes : fournira toujours une barre de défilement
    • no : ne fournira pas de barre de défilement.
    sandbox HTML5 seulement
    Si cet attribut vaut la chaîne de caractères vide (""), il entrainera l'activation de restrictions supplémentaires concernant le contenu à afficher dans l'élément. La valeur de cet attribut peut être une liste de mots-clés séparés par un espace, chacun de ces mot-clé lèvera une restriction spécifique. Les mots-clés autorisés sont :
    • allow-same-origin : permet au contenu d'être traité comme s'il était affiché depuis son origine. Si ce mot-clé n'est pas utilisé, le contenu intégré est traité comme s'il provenait d'une origine unique.
    • allow-top-navigation : permet au contenu intégré de charger du contenu dans le contexte de navigation de plus haut niveau. Si ce mot-clé n'est pas utilisé, cette opération est interdite.
    • allow-forms : permet au contenu intégré d'envoyer des formulaires. Si ce mot-clé n'est pas utilisé, cette opération est interdite.
    • allow-scripts : permet au contenu intégré de lancer des scripts (sans toutefois permettre la création de fenêtres popup). Si ce mot-clé n'est pas utilisé, cette opération est interdite.
    • allow-pointer-lock: Permet au contenu intégré d'utiliser le Pointer Lock API.

    Note :

    • Lorsque le document intégré possède la même origine que la page utilisée, il est fortement déconseillé d'utiliser à la fois allow-scripts et allow-same-origin car cela autorise le contenu intégré à passer outre l'attribut sandbox. Si cela est possible, il faut comprendre que cette utilisation n'est pas plus sécurisée que de celle où l'attribut sandbox n'est pas utilisé.
    • Le sandboxing (séparation des processus dans un « bac à sable » isolé) n'est souvent utile que si quelqu'un attaquant le site ne peut pas afficher de contenu en dehors de l'élément  iframe isolé (sandboxed). Il est recommandé qu'un tel contenu soit servi par la page depuis un domaine dédié séparé afin de limiter les dégats potentiels.
    seamless HTML5 seulement
    Cet attribut booléen indique si le navigateur doit afficher l'élément comme s'il faisait partie du document contenant (en appliquant par exemple les règles CSS s'appliquant à l'élément <iframe> avant d'appliquer celles de ce document et en ouvrant les liens de ce contexte de navigation dans le contexte parent à moins qu'un réglage empêche cela).
    src
    L'URL de la page à intégrer.
    srcdoc HTML5 seulement
    Le contenu de la page que le contexte intégré est supposé contenir.
    width
    Indique la largeur de l'élément. En HTML5, elle est exprimée en pixels CSS. En HTML 4.01, elle est exprimée en pixels ou par un pourcentage.

    Utilisation de scripts

    Les éléments <iframe>, tout comme les éléments <frame> font partie du pseudo-tableau window.frames.

    Depuis l'élément DOM iframe, les scripts peuvent accéder à l'objet window de la page HTML incluse grâce à la propriété contentWindow. La propriété contentDocument fait référence au document contenu à l'intérieur de l'élément iframe (et est donc équivalent à ceci : contentWindow.document), mais il n'est pas supporté par les versions d'Internet Explorer antérieures à IE8.

    Depuis l'intérieur d'un élément <frame> ou <iframe>, un script peut obtenir une référence vers la fenêtre parente grâce à window.parent.

    Les scripts qui tentent d'accéder au contenu de ces éléments (<frame> ou <iframe>) sont sujets à la règle d'origine identique (same-origin policy), et ne peuvent donc pas accéder à la plupart des propriétés de l'objet window s'ils ont été chargés depuis un autre domaine. Cela s'applique également aux scripts contenu dans un élément <frame> ou <iframe> tentant d'accéder à leur fenêtre parente. Un communication transversale entre domaines peut cependant être achevée grâce à window.postMessage.

    Exemple

    <script type="text/javascript">
      var iframe = window.getElementsByTagName( "iframe" )[ 0 ];
      alert( "Titre de l'iframe: " + iframe.contentWindow.title );
    </script>
    
    
    <iframe src="page.html" width="300" height="300">
      <p>Votre navigateur ne supporte pas l'élément iframe</p>
    </iframe>

    Note

    Gecko 6.0 note
    (Firefox 6.0 / Thunderbird 6.0 / SeaMonkey 2.3)

    À partir de Gecko 6.0 (Firefox 6.0 / Thunderbird 6.0 / SeaMonkey 2.3), le rendu des <iframe> respecte la bordure arrondie indiquée par l'élément parent lorsque l'attribut CSS border-radius est utilisé.

    Spécifications

    Spécification Statut Commentaires
    WHATWG HTML Living Standard
    La définition de '<iframe>' dans cette spécification.
    Living Standard  
    HTML5
    La définition de '<iframe>' dans cette spécification.
    Candidate Recommendation  
    HTML 4.01 Specification
    La définition de '<iframe>' dans cette spécification.
    Recommendation  

    Compatibilité des navigateurs

    Fonctionnalité Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
    Support simple 1.0 (Oui) (Oui) (Oui) (Oui)
    Attribut sandbox 4 17.0 (17.0) 10 15 5
    Attribut seamless 22 Pas de support ? 15 6
    Attribut srcdoc 4 25.0 (25.0) ? 15 ?
    Attribut allowfullscreen 17 webkit
    Nightly build
    9.0 (9.0) moz
    18.0 (18.0)
    Pas de support Pas de support Pas de support
    Fonctionnalité Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
    Support simple (Oui) (Oui) (Oui) (Oui) (Oui)
    Attribut sandbox 2.2 17.0 (17.0) 10 Pas de support 4.2
    Attribut seamless ? Pas de support ? ? ?
    Attribut srcdoc ? 25.0 (25.0) ? ? ?
    Attribut allowfullscreen ? 9.0 (9.0)moz
    18.0 (18.0)
    Pas de support Pas de support Pas de support
     

    Étiquettes et contributeurs liés au document

    Contributors to this page: tregagnon
    Dernière mise à jour par : tregagnon,