Inclure un fichier dans une page HTML sans utiliser <iframe>

Actualité

Publié par le , mis à jour le (198434 lectures)

iframe object

Si l'usage des inclusions en langage serveur n'est pas possible et si l'on tient à éviter l'usage contesté de la balise <iframe>, il est théoriquement possible d'utiliser la balise générique <object> pour inclure n'importe quel format de fichier au sein d'un document HTML.

Cependant, bien que cela fonctionne parfaitement sur Firefox, tous mes essais sur Internet Explorer avaient lamentablement échoués jusqu'à ce jour.

En fait, pour utiliser l'élément <object> sous Internet Explorer il faut en définir explicitement les dimensions :

object {
  width:400px;
  height:200px;
}

Côté HTML :

<object data="fichier.html" type="text/html">

Merci à Xavier pour m'avoir ouvert de nouveaux horizons ;)

Il reste un seul hic : pas moyen de supprimer ou cacher les vilaines barres de scroll autour de l'objet. Les "overflow: hidden" ne fonctionnent pas sous IE et Opera (mais s'appliquent bien sur Firefox). Un membre du forum a apporté une solution.

Exemple pour page.html : c'est la page principale qui appelle l'objet

<!DOCTYPE html>
<html>
<head>
<title>Test objet</title>
</head>
<body>
<object type="text/html" data="object.php" width="160" height="600">
</object>
</body>
</html>

... puis il faut appliquer ces styles à la page fille object.php :

html {
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	overflow-y: hidden;
	border: 0 none;
}

body {
	margin: 0;
	padding: 0;
	border: 0 none;
	overflow-x: hidden;
	overflow-y: hidden;
	width: 160px;
	height: 600px;
}

Commentaires

Très honnêtement, je ne vois pas trop l'avantage de la balise object par rapport aux iframes. Le rendu coté navigateur graphique est peu ou prou le même (si ce n'est que la balise object semble, à en croire ton billet, moins bien supporté, et que son usage nécessite quelques tweaks), et la page n'est pour autant pas plus accessible..

Mais peut-être suis-je passé à coté de l'aspect intéressant. C'est toutefois bon à savoir, merci!

@YoGi > En fait la raison principale est simple : <iframe> n'est pas accepté en HTML strict et XHTML strict, contrairement à <object> :

"The IFRAME element defines an inline frame for the inclusion of external objects including other HTML documents. IFRAME provides a subset of the functionality of OBJECT; the only advantage to IFRAME is that an inline frame can act as a target for other links. OBJECT is more widely supported than IFRAME, and, unlike IFRAME, OBJECT is included in HTML 4.0 Strict."
-> htmlhelp.com/reference/ht...

Je viens de me souvenir d'un autre hic.
IE entretient une notion de "flux" qui lui est propre et partage l'ensemble des éléments html en 2 classes : fenêtrés et non fenêtrés. 2 éléments de classes différentes (l'un fenêtré, l'autre pas) ne peuvent être hiérarchisés à l'aide de la propriété z-index. <object> est fenêtré, alors que les éléments courant (div, p, h1, a...) ne le sont pas. Je vous laisse deviner la suite... et lire (avec modération SVP) éventuellement ceci :
support.microsoft.com/def...

Sémantiquement parlant, ca ne dit rien du tout, car tu n'as pas de données quand au contenu de la balise object (pas plus pour l'iframe d'ailleur), seulement quant au type de celui-ci.

Merci pour cette astuce.
Super pour virer ces <iframe> que je déteste. Cela fonctionne super avec FireFox (PC et Mac). Par contre IE (6.0 XP SP2), ben pour moi ça ne marche pas. Aucun affichage. Etrange, et j'ai bien suivi l'astuce de définir la hauteur et à la largeur. Pour ma part, ma balise <object> appelle une page générée en php. Est-ce la cause du problème ?
Et pour finir, fonctionne bien avec Safari (1.24), mais arrête le chargement du reste de la page, ou tout au moins tout ce qui suit cette balise ne s'affiche plus. Une idée ?
J'ai un peu cherché sur le net, mais pas trouvé. Quels autres arguments pouvons-nous ajouter en plus de width et height ?

Salut.
Apparement XP + sp2 empeche l'execution de 'objet' en local. Si tu changes les mesures de securité ça devrait marcher...
Tu peux aussi ajouter la localisation ds la page: left et top.
Par exemple:
object{
position: absolute;
left:138px;
top: 367px;
width: 464px;
height: 505px;
overflow: auto;
}

Amicalement,
Paul

Paul,
Je ne saurais comment te remercier... Je cherche l'info depuis trois jours !

NB : si tu savais comment régler les mesures de sécurité sur XP + SP2, alors là...

Déjà MERCI !

Pascal

Salut Pascal.

En fait ce sont les mesures de securité d'ie...
Ds mon cas, ie m'a donné un message de securité genre 'ie a deshabilite l'execution des contenus actifs du document...'. Il y avait l'option 'pour permettre l'execution des contenus, faire clic ici...'.
Sinon, ds ie/ outil d'internet/options avancées/ tu peux cocher l'option 'permettre l'execution de contenu actif sur mon pc'.
je pense q c'est ce que tu cherches...

Amicalement,
Paul

Pour votre soucis avec IE6 XPSP2, afin de désactiver le blocage des scripts/objets en local il faut éditer la base de registre. Trouver dans la branche suivante :

HKEY_LOCAL_MACHINE > SOFTWARE > Microsoft > Internet > Explorer > Main > FeatureControl > FEATURE_LOCALMACHINE_LOCKDOWN

Les clés :

"iexplore.exe"
"explorer.exe"

Mettre les deux à 0 (elles ont une valeur de 1 par défaut).

Il n'est pas poosible de désactiver ce comportement pour un profil (utilisateur), seulement pour tous à la fois.

Pour les très énervantes barres de scroll de IE, essayez ça:

HTML {overflow-x:hidden;}

ça marche avec la iFrame, ça devrait marcher avec le tag Object.

Bin depuis le temps que je me demandais comment inclure une page html ds une autre sans utiliser des include php, des frames, des iframes, ou tout ces genres d'horreurs (jparel pas du include), je crois avoir trouver mon bonheur là ^^

merci bien pour cette astuce !

Vinns

Commentaires clos