Table des matières
Question :
Réponse :
Maison développement back-end tutoriel php Comment puis-je redimensionner dynamiquement une iframe pour l'adapter à son contenu ?

Comment puis-je redimensionner dynamiquement une iframe pour l'adapter à son contenu ?

Oct 26, 2024 pm 07:44 PM

How Can I Dynamically Resize an Iframe to Fit Its Content?

Redimensionner dynamiquement la hauteur de l'iframe en fonction du contenu

Question :

En incorporant une iframe dans un site Web, l'objectif est de déterminer dynamiquement la hauteur appropriée pour l’iframe. Idéalement, l'iframe devrait s'adapter au contenu qu'elle affiche sans barres de défilement, ressemblant à une intégration transparente au sein du site Web.

Réponse :

Lors de la tentative initiale de JavaScript pour calculer la hauteur, les autorisations d'accès refusées ont entravé la progression. . Par la suite, des réflexions ont été faites pour utiliser Ajax ou PHP.

Cependant, la solution réside dans l'utilisation d'un déclencheur de la page iframe dans window.onload pour communiquer la hauteur du corps à la page parent. Le parent ajuste ensuite la hauteur de l'iframe en conséquence.

<code class="html">&lt;body onload='parent.resizeIframe(document.body.scrollHeight)'&gt;</code>
Copier après la connexion
<code class="javascript">function resizeIframe(newHeight)
{
    document.getElementById('blogIframe').style.height = parseInt(newHeight,10) + 10 + 'px';
}</code>
Copier après la connexion

Bien que l'iframe puisse initialement apparaître avec une hauteur par défaut, cela peut être atténué en affichant initialement une image de chargement et en masquant l'iframe. Une fois que la fonction resizeIframe reçoit la mise à jour de la hauteur, elle peut supprimer l'image de chargement et afficher l'iframe, simulant une expérience de type Ajax.

Alternativement, si des limitations inter-domaines surviennent, un script PHP proxy pourrait faciliter l'intégration. Cependant, pour un maximum de contrôle et une facilité de mise en œuvre, embarquer directement le flux RSS du blog via PHP offre une solution viable.

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!

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

Article chaud

Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Article chaud

Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Tags d'article chaud

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

11 meilleurs scripts de raccourcissement d'URL PHP (gratuit et premium) 11 meilleurs scripts de raccourcissement d'URL PHP (gratuit et premium) Mar 03, 2025 am 10:49 AM

11 meilleurs scripts de raccourcissement d'URL PHP (gratuit et premium)

Introduction à l'API Instagram Introduction à l'API Instagram Mar 02, 2025 am 09:32 AM

Introduction à l'API Instagram

Travailler avec les données de session Flash dans Laravel Travailler avec les données de session Flash dans Laravel Mar 12, 2025 pm 05:08 PM

Travailler avec les données de session Flash dans Laravel

Misque de réponse HTTP simplifié dans les tests Laravel Misque de réponse HTTP simplifié dans les tests Laravel Mar 12, 2025 pm 05:09 PM

Misque de réponse HTTP simplifié dans les tests Laravel

Curl dans PHP: Comment utiliser l'extension PHP Curl dans les API REST Curl dans PHP: Comment utiliser l'extension PHP Curl dans les API REST Mar 14, 2025 am 11:42 AM

Curl dans PHP: Comment utiliser l'extension PHP Curl dans les API REST

Construisez une application React avec un Laravel Back End: Partie 2, React Construisez une application React avec un Laravel Back End: Partie 2, React Mar 04, 2025 am 09:33 AM

Construisez une application React avec un Laravel Back End: Partie 2, React

12 meilleurs scripts de chat PHP sur Codecanyon 12 meilleurs scripts de chat PHP sur Codecanyon Mar 13, 2025 pm 12:08 PM

12 meilleurs scripts de chat PHP sur Codecanyon

Notifications à Laravel Notifications à Laravel Mar 04, 2025 am 09:22 AM

Notifications à Laravel

See all articles