couleur de fond d'une iframe

Version imprimable

16/05/2011, 23h32
laurentSc

couleur de fond d'une iframe

Bonsoir,

je voudrais régler la couleur de fond d'une iframe, alors que pour l'instant, c'est tout blanc. J'ai essayé ça :

Code:

<iframe style="background-color:#ffccff;" src="css.php" frameborder=0></iframe>

mais ça ne marche pas ; que faudrait-il faire ?
17/05/2011, 08h56
Bisûnûrs

C'est pas comme si tu avais déjà fait ce sujet :
http://www.developpez.net/forums/d10...r-fond-iframe/
17/05/2011, 09h24
laurentSc
Citation:

C'est pas comme si tu avais déjà fait ce sujet :

Je sais :) et j'ai commencé par regarder ça, mais je n'ai pû appliquer ce que tu avais marqué, notamment de mettre une couleur de fond au fichier PHP appelé par l'iframe, vu qu'il n'y en a pas :
Code:

1 2 3 4 5 <?php echo '<style type="text/css">'; if(isset($_GET['size']) and !empty($_GET['size'])) echo '#id1 { font-size='.intval($_GET['size']).'px; }'; echo '</style>'; ?>
Comment puis-je faire ?
17/05/2011, 09h51
Bisûnûrs

Vu qu'il n'y en a pas ..?
Le code CSS est le seul contenu de ton fichier PHP ? Il ne sert à rien alors ..
Je ne comprends pas du tout ce que tu veux faire exactement et quelle est la finalité de tout ceci.

Quel est le code de la page de l'iframe ? Tu peux le modifier ? Si oui, tu peux rajouter facilement une couleur de fond au body. Il n'y a que du CSS dans ce fichier ? Si oui, quel intérêt ? Et pourquoi vouloir l'afficher dans ce cas ?
Bref, sois clair, précis ..
17/05/2011, 10h32
laurentSc
Citation:

Le code CSS est le seul contenu de ton fichier PHP ? Il ne sert à rien alors ..

Je ne sais pas si ça sert à rien, mais c'est la seule solution que j'ai trouvée ; mon idée est de pouvoir dynamiquement changer la taille des caractères (j'ai fait un site pour un club handisport, actuellement illisible par les mal-voyants ; donc l'idée est de rajouter un ID là où il y a du texte, et de permettre de changer la font-size sur cet ID).
Voilà le code d'un appel de l'iframe :
Code:

1 2 <?php echo '<iframe style="background-color:#ffccff;" src="css.php?size='.$taille_pol.'" frameborder=0></iframe>'; ?>
la variable $taille_pol étant gérée beaucoup plus haut.
Je ne sais pas si j'ai répondu à tes questions ; dis-moi.
17/05/2011, 11h07
Bisûnûrs

Citation:

Envoyé par Bisûnûrs

Quel est le code de la page de l'iframe ? Tu peux le modifier ? Si oui, tu peux rajouter facilement une couleur de fond au body. Il n'y a que du CSS dans ce fichier ? Si oui, quel intérêt ? Et pourquoi vouloir l'afficher dans ce cas ?

Et la réponse à toutes ces questions ?

Surtout qu'il n'y a pas d'iframe dans le lien que tu donnes, donc je ne peux même pas voir moi-même ..

Citation:

Surtout qu'il n'y a pas d'iframe dans le lien que tu donnes, donc je ne peux même pas voir moi-même ..

Exact, pour l'instant, j'ai fait un site de test sur lequel je teste l'idée. Les boutons A+ et A- sont tout en haut au-dessus du bandeau ; le carré blanc de l'iframe se voit bien quand on clique sur un des boutons ; l'affichage "taille avant/taille après" est provisoire (évidemment) et quand on a cliqué sur un des boutons, pour revenir en arrière, soit flèche précédent du navigateur, soit (plus propre) cliquer sur "essai" dans le pied de page. Par contre, on voit que le font-size est bien pris en compte dans la taille du "coucou" sur la droite.

Citation:

Quel est le code de la page de l'iframe ?

Code appelé si on clique sur A+ :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<?php
session_start();
$taille_pol= (!isset($_COOKIE["taille_pol"]))? "12":$_COOKIE["taille_pol"];
$avant_modif=$taille_pol;
switch(intval($taille_pol)) {
case 10 : $taille_pol= "12"; break;
case 12 : $taille_pol= "15"; break;
case 15 : $taille_pol= "20"; break;
case 20 : $taille_pol= "30"; break;
case 30 : $taille_pol= "30"; break;
default : $taille_pol= "12"; break;
}
setcookie("taille_pol",  $taille_pol);
$_SESSION['size']=$taille_pol;
echo "taille avant=".$avant_modif."<br>";
echo "taille apres=".$taille_pol."<br>";
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="fr" >
<head>
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
<title>essai</title>
<meta http-equiv="content-style-type" content="text/css">
<meta name="generator" content="Lauyan TOWeb 3.1.7.579">
<style type="text/css"> body { background-attachment: fixed; background-repeat: repeat; background-position: top center;}</style>
 
<link rel="stylesheet" href="../_frame/site.css" type="text/css">
<style type="text/css" media="print">
.wg-maxheight {}
</style>
<style type="text/css" media="screen">
.wg-maxheight { height:100%; }
</style>
</head>
<body>
<table bgcolor="#FFCCFF" class="wg-maxheight" border="0" cellspacing="0" cellpadding="0" width="100%">
<!--BANNER-->
<tr><td align="center" valign="top" style="height:1px" bgcolor="#FF99FF"><table class="wg-paragraph" width="100%"><tr><td width="33%" valign="top" align="left"><font style="font-size:80%;">Copyright &copy; 2011. Tous droits réservés.</font></td><td width="33%" valign="top" align="center"><font style="font-size:80%;"><a href="../agrandir/index.php">A+</a>* <a href="../diminuer/index.php">A-</a></font></td><td width="33%" valign="top" align="right"><font style="font-size:80%;">essai</font></td></tr></table><a href="../introduction/index.html"><img src="../_frame/banusr.png" border="0" alt=""></a></td></tr>
<tr>
 <td valign="top" class="wg-maxheight">
       <table width="100%" class="wg-maxheight" cellpadding="0" cellspacing="0">
        <tr>
         <td valign="top" bgcolor="#FFCCFF" >
          <table width="100%" class="wg-maxheight" cellpadding="0" cellspacing="0">
           <tr>
            <td valign="top" >
<table class="wg-paragraph" cellspacing="2" width="100%"><tr><td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0"><tr><td valign="top"><a name="signet "></a><table class="wg-paragraph" width="100%"><tr><td style="text-align:justify"><br><!-- Entrez le script du champ ici. Ce contenu sera inséré tel quel dans votre site.
 
//-->
<!-- Entrez le script du champ ici. Ce contenu sera inséré tel quel dans votre site.
 
//-->
<?php 
// session_start()
// agrandir
 
 
?>
<style type="text/css">
iframe#id_frame {
background-color:#ffccff;
}
</style>
<?php
echo '<iframe  style="background-color:#ffccff;" src="css.php?size='.$taille_pol.'" frameborder=0></iframe>';
 
?>*</td></tr></table></td></tr></table></td></tr></table><br><hr><table width="100%"border="0" class="wg-paragraph"><tr><td width="100%"  valign="top" align="center"><font style="font-size:80%;"><a href="../topic/index.php">essai</a><br></font></td></tr></table>
            </td>
           </tr>
          </table>
         </td>
        </tr>
       </table>
 </td>
</tr>
</table>
 
</body></html>

Citation:

Tu peux le modifier ?

No problem...

Citation:

Si oui, tu peux rajouter facilement une couleur de fond au body

Mais il s'agit du body de la page appelée par l'iframe, pas de la page qui contient l'iframe...

Citation:

Il n'y a que du CSS dans ce fichier ? Si oui, quel intérêt ?

Il n'y a effectivement que du CSS dans le fichier appelé par l'iframe et je crois que je t'en ai donné le but dans un précédent post.

Citation:

Et pourquoi vouloir l'afficher dans ce cas ?

Mais je ne l'affiche pas...(Comme tu pourras le voir, si tu vas sur mon site de test)

17/05/2011, 13h43
Bisûnûrs

Je vais donc te faire la même réponse que dans l'autre sujet, vu que visiblement tu ne veux pas la mettre en place :

Citation:

Envoyé par Bisûnûrs

Il faut aussi gérer la couleur de fond de l'élément body de l'iframe.

http://www.developpez.net/forums/d10...e/#post5946625

Ca y est ; c'est soldé (j'ai mis le temps ;) ), mais pour se faire, j'ai dû mettre un body au fichier PHP :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title></title>
</head>
<body >
<style>
body {background-color : #ffccff;}
</style>
<?php
echo '<style type="text/css">';
if(isset($_GET['size']) and !empty($_GET['size'])) echo '#id1 { font-size:'.intval($_GET['size']).'px; }';
echo '</style>'; 
?>
</body>
</html>