Maison > interface Web > js tutoriel > Comment ajuster la hauteur de l'iFrame au contenu sans barres de défilement ?

Comment ajuster la hauteur de l'iFrame au contenu sans barres de défilement ?

DDD
Libérer: 2024-11-17 11:10:02
original
465 Les gens l'ont consulté

How to Adjust iFrame Height to Content Without Scrollbars?

Ajuster la hauteur de l'iFrame au contenu sans barres de défilement

Créer un iFrame qui ajuste sa hauteur de manière transparente pour afficher tout son contenu sans utiliser de barres de défilement peut être une tâche ardue. défi. Cependant, une solution existe grâce à l'utilisation de JavaScript.

Réponse :

Envisagez d'incorporer les éléments suivants :

  1. Ajoutez le script ci-dessous à votre section :
<script>
  function resizeIframe(obj) {
    obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px';
  }
</script>
Copier après la connexion
  1. Modifiez votre code iFrame pour inclure les éléments suivants :
<iframe src="..." frameborder="0" scrolling="no" onload="resizeIframe(this)" />
Copier après la connexion

Cet ajout de script et d'attribut redimensionne dynamiquement la hauteur de l'iFrame en fonction de la hauteur du contenu, éliminant le besoin de barres de défilement et garantissant une expérience visuelle optimale.

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal