substitution des frames

**souminet** · 23/06/2010, 09h46

Bonjour à tous
Voilà, je ne sais pas vraiment si le topic que je viens d'ouvrir correspond vraiment à cette section du forum...

Je suis en train de concevoir une application Web, et je suis pour ainsi dire nouvelle dans le domaine, alors j'ai commencé tout d'abord par utiliser les frames pour faciliter la navigation ; cependant quand il fallut utiliser les variables dans PHP J'ai pris conscience que les frames n'étaient pas trés recommandés (Du moins c'est ce que l'ai lu) bref, maintenant je voudrais reproduire l'interface de mon application en utilisant des" include " et du css , le problème c'est que je n'arrive pas à reproduire le chevauchement des cadres initiaux ...
Gràce aux Frames, mon interface se compose d'un menu Horizontal (En haut), d'un menu vertical (Coté gauche) et d'un espace au centre ... (Cadres supérieur et imbriqué à gauche) voilà le code de la page principale :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Gpm</title>
</head>
 
<frameset rows="186, 1*" cols="*" frameborder="no" border="0" framespacing="0">
  <frame src="menuframe-2.html" name="topframe" scrolling="no" noresize="noresize" id="topframe" title="menuhorizontal" />
  <frameset rows="*" cols="185, 1*" framespacing="0" frameborder="no" border="0">
    <frame src="menuvframe.html" name="leftframe" scrolling="no" noresize="noresize" id="leftframe" title="leftframe" />
    <frame src="gpm_interface.php" name="mainframe" id="mainframe" title="mainframe" />
  </frameset>
</frameset>
<noframes><body>
</body>
</noframes></html>

Merci de m'aider, s'il vous plaît

PS: J'ai joint une petite image pour donner un aperçu du résultat souhaité

**Vil'Coyote** · 23/06/2010, 13h56

je vois pas trop le souci?

au lieu d'avoir 1 page principale + 3 frames
tu va avoir une page principale incluant les 3 pages en question
donc il te suffit de faire la mise en page à l'identique dans ta page principale soit par des div + css soit par un tableau

**souminet** · 24/06/2010, 10h10

Envoyé par Vil'Coyote

je vois pas trop le souci?

au lieu d'avoir 1 page principale + 3 frames
tu va avoir une page principale incluant les 3 pages en question
donc il te suffit de faire la mise en page à l'identique dans ta page principale soit par des div + css soit par un tableau

Merci de votre réponse;
Je sais qu'il fallait utiliser les DIV et le css; j'ai essayé mais je n'arrive pas à reproduire la mise en page, les pages se chevauchent , est ce que quelqu'un pourrait me proposer une ébauche de code avec les div????

merci

**santaflam** · 24/06/2010, 11h02

Bonjour,

s il s agit seulement de la mise en page par DIV, voici un exemple (event. enlever barre de langage) - il y a un tutoriel aussi qui explique les propriétés CSS float en l occurrence -

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
	<title>CompanyName - PageName</title>
 
	<meta name="description" content="Description" />
	<meta name="keywords" content="Keywords" />
 
	<meta name="author" content="le site" />
 
<style>
 
 
html,body {
        height:100%;
        margin:0;
        padding:0;
        border:0;
}
 
 
 
#container {
        width: 760px;
        height: 100%;
        margin: auto;
        padding: 0;
        border: 0;
}
 
#header {
        background: red;
        height: 50px;
        margin: 0 auto;
}
 
 
#language_bar {
        background: yellow;
        height: 15px;
}
 
#wrap {
        background: blue;
        height: 100%;
}
 
#menu {
        float: left;
        background: white;
        width: 150px;
        height: 100%;
}
 
 
#content {
        background: orange;
        height: 100%;
}
 
#footer {
        clear: both;
        background: white;
        height: 50px;
        margin: 0 auto;
        border-top: 1px solid #000000;
}
</style>
 
 
</head>
<body>
 
<div id="container">
	<div id="header">
		Le header
	</div>
	<div id="language_bar">
		barre de langage
	</div>
 
	<div id="wrap">
 
		<div id="menu">
			Le menu
		</div>
		<div id="content">
<BR>Le content
		</div>
	</div>
	<div id="footer">
		Le footer
	</div>
</div>
 
 
</body>
</html>

**souminet** · 24/06/2010, 14h08

Merci j'ai réussi à le faire grâce au code de santaflam; maintenant j'ai un autre soucis , en fait Le div "Content" devrait contenir à haque fois une page différente via des includes , mais je n'arrive pas à reproduire cela.
c'est à dire :
qu'en cliquant sur le lien #1 le div "content" devrait afficher la page : page1.php
en cliquant sur le lien #2 le div "content" devrait afficher la page : page2.php
et ainsi de suite....
par défaut en chargeant la page principale , j'affiche ce qui suit :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<div id="container">
	<div id="header">
		<?php include('menuframe-2.html');
?>
</div>
  <div id="menu">
			<?php include('menuvframe.html');
?>
		</div>
		<div id="content">
<?php include('gpm_interface.php');
?>
		</div>
	<div id="footer">
		Le footer
	</div>
</div>
 
 
</body>

Le lien est comme suit :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<td width="105"><a href="gpm_parution.php" ><img src="images/publication.jpg" width="100" height="30" border="0"></a></td>

Le problème est que la page sur laquelle pointe le lien s'affiche dans une fenêtre différente, et pas dans l'espace réservé par le div "Content"

Merci

**Vil'Coyote** · 24/06/2010, 15h16

salut,
tes liens devrais plutôt être du style :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
<a href='tapageprincipale?choix=1'>lien1</a>
<a href='tapageprincipale?choix=2'>lien2</a>
 
et pour ton content : 
		<div id="content">
                  <?php 
                       if(isset($_GET["choix"])
                       {
                           switch($_GET["choix"])
                           {
                               case 1: include("mapage1.php");
                                            break;
                               case 2 : .......
                                             .......
                               default : include("tapagepardéfaut.php")
                           }
                       }
                   ?>
		</div>

substitution des frames

HTML

Vue hybride

Discussions similaires

Partager

Partager