Menu toujours visible

**nicerico** · 20/10/2008, 17h44

bonjour

j'ai une structure en 3 parties
haut - gauche - droite (3 div)
dans gauche, j'ai 2 autre div que je voudrais "scrolable"

le css :

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
 
#gauche {
position:relative;
float:left;
background-color:#9fc90f;
width:209px;
min-height:578px;
}
#menu_gauche {
background-image:url(../images/cadre_gauche.jpg);
background-repeat:no-repeat;
margin-left:10px;
margin-right:10px;
width:189px;
height:253px;
}
#txt_scroll {
background-image:url(../images/cadre_gauche.jpg);
background-repeat:no-repeat;
margin-top:20px;
margin-left:10px;
margin-right:10px;
width:189px;
height:253px;
}

le html :

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
 
	<div id="centre">
          <div id="gauche">
                <div id="menu_gauche">
                <ul>
                <li><img src="images/fleche.jpg">&nbsp;<a href="le_salon.htm">LE SALON</a></li>
                <li><img src="images/fleche.jpg">&nbsp;<a href="exposer.htm">EXPOSER</a></li>
                <li><img src="images/fleche.jpg">&nbsp;<a href="visiter.htm">VISITER</a></li>
                <li><img src="images/fleche.jpg">&nbsp;<a href="animation.htm">ANIMATION</a></li>
                <li><img src="images/fleche.jpg">&nbsp;<a href="photos_et_videos.htm">PHOTOS ET VIDEOS</a></li>
                <li><img src="images/fleche.jpg">&nbsp;<a href="partenaires.htm">PARTENAIRES</a></li>
                <li><img src="images/fleche.jpg">&nbsp;<a href="questions_et_commentaires.htm">QUESTIONS ET <BR>COMMENTAIRES</a></li>
                </ul>
                </div>
                <div id="txt_scroll"></div>
          </div>
          <div id="droite">&nbsp;</div>
	</div>

tous les script que j'ai trouvé et essayé ne prennenet pas en compte le fait que ce que je veux "scroller" est dans une div à l'intérieur d'autre div

Merci de votre aide

**Bovino** · 20/10/2008, 21h18

Rien à voir avec javascript, c'est du css... Il faut utiliser la règle overflow (dans ton cas scroll ou auto) :

Code css :

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

1
2
3
4
5
6
7
8
9
10
#txt_scroll {
background-image:url(../images/cadre_gauche.jpg);
background-repeat:no-repeat;
margin-top:20px;
margin-left:10px;
margin-right:10px;
width:189px;
height:253px;
overflow:auto;
}

**nicerico** · 21/10/2008, 06h47

je veux que tout le bloc concerné descende si on scoll avec la souris
comme le font certains menus qui s'affiche dans le coin haut gauche de la page et qui descendent si on scroll la page

**SpaceFrog** · 21/10/2008, 09h00

Comme le dit Beef c'est que du css
inspire toi de ça :

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
<html>
<head>
<title>Mon bouton mouvant</title>
<style type="text/css">
body{overflow:hidden;margin:0px;}
#fixed 	{position:absolute;
			 top:0px;
			 left:0px;
			 width:100px;
			 height:200px;
			 border : solid 1px red;
			 text-align:center;
			 z-index:2;
			 ;}
</style>
</head>
 
<body onselectstart="return false;">
 
<div id="fixed">
ici ton menu
</div>
 
<div id="cont" style="width:100%; height:100%; overflow:auto;">
 
<div style="height:1200px;">
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<h1>Mon beau Site</h1>
<p>Amusez vous à défiler la page.</p>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<h1>Mon beau Site</h1>
<p>Amusez vous à défiler la page.</p>
 
</div>
 
</div>
 
</body>
</html>

**nicerico** · 21/10/2008, 09h33

Merci

ça m'a permis de resoudre (en bidouillant) mon probleme

Menu toujours visible

JavaScript

Discussions similaires

Partager

Partager