rendre Mobile un div contenant un menu
bonjour à tous
s'il vous plait j'aimerais rendre Mobile un div contenant un menu au clic dessus et pas cacher complètement en javascript
voici mon div
Code:
1
2
3
4
5
6
7
8
9
|
<div id="AGauche_Haut" onclick="cache_menu()">
<ul>
<li><a href="#" title="Menu1"> Menu1</a></li>
<li><a href="#" title="Menu2"> Menu2</a></li>
<li><a href="#" title="Menu3"> Menu3</a></li>
<li><a href="#" title="Menu4"> Menu4</a></li>
</ul>
</div> |
son css
Code:
1
2
3
4
5
6
7
8
9
10
11
12
|
#AGauche_Haut
{
background-color:#999933;
border-right:#990000 solid 7px;
width:188px;
height:160px;
margin-top:;
display:block;
float:left;
position:fixed;
} |
Ce code Js le cache complètement
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
var visible=true;
function cache_menu()
{ var i=0;
if(visible==true)
{
document.getElementById("AGauche_Haut").style.display="none";
visible=false;
}
else
{
document.getElementById("AGauche_Haut").style.display="block";
visible=true;
}
} |
avec celui ci j'essaye de diminuer progressivement sa largeur sans succès jusqu'à présent mais je n'ai pas les effets recherchés
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
var visible=true;
function cache_menu()
{ var i=0;
largeur=document.getElementById("AGauche_Haut").offsetWidth;
{
while(largeur>5)
{
document.getElementById("AGauche_Haut").style.width=largeur+'px';
setTimeout("", 1000);
largeur--;
}
visible=false;
}
else
{
document.getElementById("AGauche_Haut").style.display="block";
visible=true;
}
} |
Merci de me proposer une piste
