Comment puis-je désactiver efficacement les barres de défilement dans une iframe HTML ?

Désactiver les barres de défilement dans une iframe HTML

Les éléments Iframe fournissent un moyen d'intégrer du contenu externe dans une page Web. Cependant, activer le défilement dans ces iframes peut créer un encombrement visuel indésirable. Cet article aborde le problème de la désactivation des barres de défilement lors de l'utilisation d'éléments iframe.

Le code HTML fourni dans la question illustre l'utilisation des iframes, en utilisant les attributs HTML et CSS :

<iframe src="<<URL>>" height="800" width="800" sandbox="allow-same-origin allow-scripts allow-forms" scrolling="no"></iframe>

Malgré l'utilisation de scrolling="no", les barres de défilement apparaissent toujours. Pour approfondir la solution, il est crucial de comprendre le statut de l'attribut de défilement en HTML5.

Malheureusement, la propriété de défilement a été omise de la spécification HTML5. Cependant, la plupart des navigateurs actuels continuent de le prendre en charge. La propriété overflow à elle seule n'est pas une solution viable en HTML5, car Firefox est le seul navigateur moderne qui la prend en charge par erreur.

Une solution de contournement pratique consiste à combiner les deux approches :

<iframe src="" scrolling="no"></iframe>

iframe {
  overflow: hidden;
}

Cette solution risque de devenir obsolète à mesure que les navigateurs évoluent. Pour une solution plus complète utilisant JavaScript, reportez-vous au lien fourni dans la réponse acceptée.

Modifier : Selon les tests, la définition de scrolling="no" désactive efficacement les barres de défilement dans IE10 et Chrome 25. , et Opéra 12.12.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!