cacher la scrollbar d'une liste.

**manutudescends** · 21/09/2006, 11h56

Bonjour,
j'ai une liste définie de la facon suivante.

Code :

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

1
2
3
4
5
<select id="library_list" name="library_list" size="15"> 
				<option value="clé1">valeur1</option>
				<option value="clé2">valeur2</option>
				<option value="clé3">valeur3</option>
		</select>

A coté de ca , j'ai un style css associé.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
select#library_list{
	font-size:20pt;
	overflow:hidden;
	position:absolute;
	top:57px;
	left:17px;
	width:869px;
	height:580px;
	z-index:0;
	background:red; 
	color: white ;
	}

seulement il reste la scrollbar.
Y a t'il une solution pour la cacher car ma navigation à l'intérieur de la liste se fait via deux boutons qui activent des fonctions javascript et donc je n'ai pas besoin de la scrollbar.

Merci

**trotters213** · 21/09/2006, 12h00

Essaie avec du javascript :

Code :

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

1
2
3
4
5
6
7
<script language="javascript">
<!--
function cacher()
{
document.body.style.overflow='hidden';
}
//-->

**manutudescends** · 21/09/2006, 15h15

faire de cette manière, ca enlève la scrollbar de ma page mais pas celle de mon select.

**trotters213** · 21/09/2006, 15h22

oui parce qu'il y a document.body.... mais il faut que tu adapte à ta liste

**manutudescends** · 21/09/2006, 15h56

ben si je fais un document.getElementById("library_list").overflow = 'hidden', ca n'a aucun effet.

**manutudescends** · 21/09/2006, 16h59

j'ai créé deux petits fichiers de tests et dans ceux ci, je n'arrive toujours pas à faire ce que je veux. Les voici

fichier 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
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<html>
	<head>
		<title> test</title>
		<script>
			function hideScroll(){
				// cacher la barre de naviagation principale
				document.body.style.overflow='hidden';
				alert(document.formulaire.liste.selected); 
			}
		</script>
		<link rel="stylesheet" type="text/css" href="test.css"/>
	</head>
	<body>
		<form name="formulaire" >
			<select name="liste" ID="liste" size="3">
				<option value="chosen1">option1</option>
				<option value="chosen2">option2</option>
				<option value="chosen3">option3</option>
				<option value="chosen4">option4</option>
				<option value="chosen5">option5</option>
				<option value="chosen6">option6</option>
				<option value="chosen7">option7</option>
				<option value="chosen8">option8</option>
				<option value="chosen9">option9</option>
				<option value="chosen10">option10</option>
				<option value="chosen11">option11</option>
				<option value="chosen12">option12</option>
			</select>
		</form>
		<a href="javascript:hideScroll();">
		clic
		</a>
	</body>
</html>

fichier test.css

Code :

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

1
2
3
4
5
#liste{
overflow = 'hidden';
font-size:20pt;
background:rgb(97,114,128);
}

une idée?

**delas** · 21/09/2006, 17h05

je vois pas trop a quoi ca sert de mettre des elements dans ta liste si il y a pas de scroll bar pour les atteindre?

et si tu limitais tes options a 3?

**manutudescends** · 21/09/2006, 18h04

ha oui j'ai oublié de préciser. J'ai deux boutons javascript qui permettent de changer dans les options.
C'est un peu pour ca que la scrollbar est inutile.