J'ai créé une application iframe Facebook et défini les dimensions sur Redimensionnement automatique dans la page des paramètres de l'application Facebook, mais une barre de défilement horizontale s'affiche toujours en bas dans IE et Google Chrome. Cela fonctionne bien dans Firefox. Une solution ?
La façon de procéder est expliquée ici : http://clockworkcoder.blogspot.com/2011/02/how-to-removing-facebook-application-i.html En principe, vous devez utiliser
window.fbAsyncInit = function() {
FB.Canvas.setAutoGrow();
};De plus, assurez-vous que vos balises html et body sont définies comme suit overflow:hidden pour ne pas avoir ces barres de défilement brièvement affichées qui sont si ennuyeuses.
<html xmlns="http://www.w3.org/1999/xhtml" style="overflow: hidden">
<head>
<!-- Header stuff -->
</head>
<body style="overflow: hidden">
Vous ne voulez vraiment pas ajouter "overflow : hidden" sur le corps du texte car cela désactivera également le défilement vertical. Voir stackoverflow.com/a/9809635/253704 pour une solution appropriée.
@twig c'est tout l'intérêt, vous ne voulez pas que les barres de défilement verticales apparaissent pour que cela ne ressemble pas à un i-frame mais à quelque chose d'intégré à la page facebook. Le but de setAutoResize est de redimensionner votre i-frame pour qu'il n'ait pas besoin de barres de défilement.
Vous devez également lancer le timer pour appeler le code d'autoréalisation. Dans vos applications HTML, faites :
window.fbAsyncInit = function() {
FB.Canvas.setAutoResize();
};Le code ci-dessus vérifiera les dimensions du contenu toutes les 100ms. Si vous voulez utiliser un timing différent, vous pouvez passer les millisecondes comme variable :
window.fbAsyncInit = function() {
FB.Canvas.setAutoResize(50);
};Si la taille de votre contenu ne change pas après le chargement de la page, vous pouvez économiser des cycles CPU en modifiant la taille du contenu une seule fois manuellement :
window.fbAsyncInit = function() {
FB.Canvas.setSize();
}Vous pouvez même passer la taille désirée comme paramètre
window.fbAsyncInit = function() {
FB.Canvas.setSize({ width: 520, height: 600 });
}
J'ai essayé tout ce que vous avez dit et regardé ces deux liens soit ( CSS + FireFox : masquer la barre de défilement sur un iframe avec scrolling=yes - la hauteur de la toile de facebook n'est pas définie par le scroll dans ie8 et firefox ) qui discute du même problème, mais ça n'a pas marché pour moi.
Ce qui a fonctionné pour moi, c'est de modifier les paramètres du canevas dans la section avancée de la configuration du canevas de l'application ( https://developers.facebook.com/apps ) à une largeur de toile fixe (760px) et une hauteur (fixe à 800).
J'espère que cela vous aidera.
Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.
0 votes
Si vous utilisez Chrome, il y a un problème connu où la page facebook elle-même (pas l'iFrame) a une barre de défilement horizontale. Ce problème n'a pas encore été corrigé. developers.facebook.com/bugs/182748101891780