Javascript: animation déploiement menu...
Fetide68
Messages postés
6
Date d'inscription
Statut
Membre
Dernière intervention
-
Utilisateur anonyme -
Utilisateur anonyme -
Bonjour,
J'essaie d'animer un menu en javascript, mais c'est pas encore au point...
Comment je pourrais améliorer ce script qui fonctionne à priori sur IE et FF ?
Je ne suis pas contre une proposition de code, mais je souhaiterais avant tout comprendre ce que vous me proposer (sans profiter d'une réponse toute faite: pas un feignant moi... hehe). Merci pour votre comprésenhion.
Merci beaucoup pour votre aide.
J'essaie d'animer un menu en javascript, mais c'est pas encore au point...
Comment je pourrais améliorer ce script qui fonctionne à priori sur IE et FF ?
Je ne suis pas contre une proposition de code, mais je souhaiterais avant tout comprendre ce que vous me proposer (sans profiter d'une réponse toute faite: pas un feignant moi... hehe). Merci pour votre comprésenhion.
<html>
<head>
<style type="text/css">
ul.menu { background: red; width: 300px; margin: 0px; padding: 0px; list-style: none; }
ul.sousmenu { background: yellow; overflow: hidden; }
a { color: #fff; }
</style>
<script language="JavaScript">
var menus=new Array("m1","m2");
function show(id) {
size=0;
menu=document.getElementById('id');
for (i=0;i<menus.length;i++) {
if (menus[i]!=id) document.getElementById(menus[i]).style.display="none";
else document.getElementById(menus[i]).style.display="block";
}
setInterval("agrandir('"+id+"')",10);
}
function agrandir(id) {
var menu=document.getElementById(id);
if (size<=80) {
document.getElementById(id).style.height=size+"px";
size++;
}
}
</script>
</head>
<body>
<ul class="menu">
<li><a href="#" onmouseover="show('m1');">Test 1</a></li>
<ul class="sousmenu" id="m1" style="display: none; height: 0px;">
<li>Test 1</li>
<li>Test 1</li>
<li>Test 1</li>
<li>Test 1</li>
</ul>
<li><a href="#" onmouseover="show('m2');">Test 2</a></li>
<ul class="sousmenu" id="m2" style="display: none;">
<li>Test 2</li>
<li>Test 2</li>
<li>Test 2</li>
<li>Test 2</li>
</ul>
</ul>
</body>
</html>
Merci beaucoup pour votre aide.
A voir également:
- Javascript: animation déploiement menu...
- Telecharger javascript pour pc - Télécharger - Langages
- A javascript error occurred in the main process français - Forum Windows
- Javascript arrondi ✓ - Forum Windows
- Javascript arrondir à 2 décimales - Forum Webmastering
- Javascript void 0 c'est quoi ✓ - Forum Réseaux sociaux