Accueil > > > MENU VERTICAL DYNAMIQUE
MENU VERTICAL DYNAMIQUE
Information sur la source
Description
Ce menu se deplace sur l'axe des ordonnées selon la position du curseur sur ce meme axe. Le menu est en réalité un tableau dont la hauteur de la premiére ligne change en fonction de la position du curseur. changement de couleur de la ligne lorsque la souris passe dessus.
Source
- <!--
- But: menu dynamique vertical: le tableau qui represente le menu, se deplace verticalement selon
- la position du curseur sur l'axe des ordonnées.
- Ajout également d'un effet sur la ligne du tableau lors du passage de la souris.
- -->
- <html>
- <head>
- <title>Menu dynamique vertical</title>
-
- <SCRIPT LANGUAGE=JavaScript>
- //permet de deplacer sur la hauteur un tableau par le biais d'un changment de taille de la premiere ligne du tableau
- function TableauDynamique(e)
- {
- //recupére le deplacement du curseur sur l'axe des y
- y = (navigator.appName.substring(0,3) == "Net") ? e.pageY : event.y+document.body.scrollTop;
- // petit calcul pour pouvoir accéder à tout les champ du menu quelques soit la position du menu
- //remarque: si ajout de ligne dans le menu, penser à modifier le calcul si nécessaire
- var taille="";
- if (y<250)
- {
- taille =Math.floor(y/110)*100;
- }
- else if (y<750)
- {
- taille =Math.floor(y/110)*100+50;
- }
- else if (y<850)
- {
- taille =Math.floor(y/110)*100+75;
- }
- else
- {
- taille =Math.floor(y/110)*100+100;
- }
- document.getElementById("cellule").style.height=taille;
- }
- if (navigator.appName.substring(0,3) == "Net") document.captureEvents(Event.MOUSEMOVE);
- document.onmousemove = TableauDynamique;
-
- </SCRIPT>
-
- </head>
-
- <body >
-
-
- <table align="left">
- <TR>
-
- <TABLE align="left">
- <TR >
-
- <TD id="cellule">
-
- </TD>
- <TD >
-
- </TD>
- </tr>
- <!-- ceci c'est pour permettre le changement de couleur de la ligne du tableau quand la souris passe dessus -->
- <TR onmouseover="this.bgColor='#7f8aed';" onmouseout="this.bgColor='#e6e8fa';" BGCOLOR="#e6e8fa" border="2" BORDERCOLOR="#7f8aed" cellspacing="4">
- <TD >
- 1.
- </TD>
- <!--j'ai laisser les lien qui bien sur ne fonctionne pas vu que c'est juste un morceau du code original -->
- <a href="#nb"> <TD style="cursor: pointer">
- <p><font color="#3333cc"><SPAN TITLE="Choix du nombre de facteur(s)">Nombre de Facteur(s)</span></font></p>
- </TD></a>
- </TR>
- <TR onmouseover="this.bgColor='#7f8aed';" onmouseout="this.bgColor='#e6e8fa';" BGCOLOR="#e6e8fa" border="2" BORDERCOLOR="#7f8aed" cellspacing="4">
- <TD>
- 2.
- </TD>
- <a href="#param"> <TD style="cursor: pointer">
- <p><font color="#3333cc"><SPAN TITLE="Paramétrage de l'analyse: le(s) facteur(s), mesure repeté ou non, post-Hoc, avec ou sans interaction">Paramétrage de l'analyse</span></font></p>
- </TD></a>
- </TR>
- <TR onmouseover="this.bgColor='#7f8aed';" onmouseout="this.bgColor='#e6e8fa';" BGCOLOR="#e6e8fa" border="2" BORDERCOLOR="#7f8aed" cellspacing="4">
- <TD>
- 3.
- </TD>
- <a href="#option"><TD style="cursor: pointer">
- <p><font color="#3333cc"><SPAN TITLE="Option du post-Hoc"> Options </span></font></p>
- </TD></a>
- </TR>
- <TR onmouseover="this.bgColor='#7f8aed';" onmouseout="this.bgColor='#e6e8fa';" BGCOLOR="#e6e8fa" border="2" BORDERCOLOR="#7f8aed" cellspacing="4">
- <TD>
- 4.
- </TD>
- <a href="#resultat"> <TD style="cursor: pointer">
- <p><font color="#3333cc"><SPAN TITLE="Affichage des resultats au format HTML ou RTF (Word)">Résultats</span></font></p>
- </TD></a>
- </TR>
-
- </TABLE>
- </table>
- </body>
- </html>
<!--
But: menu dynamique vertical: le tableau qui represente le menu, se deplace verticalement selon
la position du curseur sur l'axe des ordonnées.
Ajout également d'un effet sur la ligne du tableau lors du passage de la souris.
-->
<html>
<head>
<title>Menu dynamique vertical</title>
<SCRIPT LANGUAGE=JavaScript>
//permet de deplacer sur la hauteur un tableau par le biais d'un changment de taille de la premiere ligne du tableau
function TableauDynamique(e)
{
//recupére le deplacement du curseur sur l'axe des y
y = (navigator.appName.substring(0,3) == "Net") ? e.pageY : event.y+document.body.scrollTop;
// petit calcul pour pouvoir accéder à tout les champ du menu quelques soit la position du menu
//remarque: si ajout de ligne dans le menu, penser à modifier le calcul si nécessaire
var taille="";
if (y<250)
{
taille =Math.floor(y/110)*100;
}
else if (y<750)
{
taille =Math.floor(y/110)*100+50;
}
else if (y<850)
{
taille =Math.floor(y/110)*100+75;
}
else
{
taille =Math.floor(y/110)*100+100;
}
document.getElementById("cellule").style.height=taille;
}
if (navigator.appName.substring(0,3) == "Net") document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = TableauDynamique;
</SCRIPT>
</head>
<body >
<table align="left">
<TR>
<TABLE align="left">
<TR >
<TD id="cellule">
</TD>
<TD >
</TD>
</tr>
<!-- ceci c'est pour permettre le changement de couleur de la ligne du tableau quand la souris passe dessus -->
<TR onmouseover="this.bgColor='#7f8aed';" onmouseout="this.bgColor='#e6e8fa';" BGCOLOR="#e6e8fa" border="2" BORDERCOLOR="#7f8aed" cellspacing="4">
<TD >
1.
</TD>
<!--j'ai laisser les lien qui bien sur ne fonctionne pas vu que c'est juste un morceau du code original -->
<a href="#nb"> <TD style="cursor: pointer">
<p><font color="#3333cc"><SPAN TITLE="Choix du nombre de facteur(s)">Nombre de Facteur(s)</span></font></p>
</TD></a>
</TR>
<TR onmouseover="this.bgColor='#7f8aed';" onmouseout="this.bgColor='#e6e8fa';" BGCOLOR="#e6e8fa" border="2" BORDERCOLOR="#7f8aed" cellspacing="4">
<TD>
2.
</TD>
<a href="#param"> <TD style="cursor: pointer">
<p><font color="#3333cc"><SPAN TITLE="Paramétrage de l'analyse: le(s) facteur(s), mesure repeté ou non, post-Hoc, avec ou sans interaction">Paramétrage de l'analyse</span></font></p>
</TD></a>
</TR>
<TR onmouseover="this.bgColor='#7f8aed';" onmouseout="this.bgColor='#e6e8fa';" BGCOLOR="#e6e8fa" border="2" BORDERCOLOR="#7f8aed" cellspacing="4">
<TD>
3.
</TD>
<a href="#option"><TD style="cursor: pointer">
<p><font color="#3333cc"><SPAN TITLE="Option du post-Hoc"> Options </span></font></p>
</TD></a>
</TR>
<TR onmouseover="this.bgColor='#7f8aed';" onmouseout="this.bgColor='#e6e8fa';" BGCOLOR="#e6e8fa" border="2" BORDERCOLOR="#7f8aed" cellspacing="4">
<TD>
4.
</TD>
<a href="#resultat"> <TD style="cursor: pointer">
<p><font color="#3333cc"><SPAN TITLE="Affichage des resultats au format HTML ou RTF (Word)">Résultats</span></font></p>
</TD></a>
</TR>
</TABLE>
</table>
</body>
</html>
Sources de la même categorie
MENU VERTICALE GAUCHE ET DROIT DEROULANTMENU VERTICALE GAUCHE ET DROIT DEROULANTc'est repris d'une de mes source (menu glissant) sauf que au lieu de deplacer un element dans le document c'est un div en overflow hidden qui s'agrand...
par kazma
MENU VERTICALE EN TRANSPARENCEMENU VERTICALE EN TRANSPARENCECe menu est complètement modifiable, les fenêtres de sous menus étant composées de plusieur images, vous pouvez modifier la taille des sous menus en...
par dlvains
MENU DÉROULANT EN IMAGESMENU DÉROULANT EN IMAGES un menu simple a modifier, il vous suffit de changer le texte sur le PSD et d'enregistrer au format PNG.
si vous modifiez la largeur des images, pe...
par dlvains
TBFRAME: TAB BROWSING FRAMETBFRAME: TAB BROWSING FRAME Cela fait un moment que j'avais eu l'idée de mettre en ligne ce script, mais je n'avais jamais eu le temps de mettre un coup de propre dans le code ai...
par triumphs
MENU PRINCIPALMENU PRINCIPALBonjour, dans ce petit source, j'ai met une belle menu avec php,javascript, css, pour me contactet , ABOUSSEBABA ALI <contact@aliwebmaster.com>, à vou...
par ali1987
Commentaires et avis
Discussions en rapport avec ce code source dans le forum
menu dynamique dans cellule tableau ? [ par seb_divweb ]
bonjour je debute et je cherche a faire la chose suivante : j'ai un tableau avec 3 colones. dans la colonne de gauche j'ai une image, qui change au s
gros problème menu dynamique [ par lilyvirus ]
Bonjour, j'ai un gros problèeme. Je ne suis pas très doué en javascript (je prefère 100* le flash) et la je suis en stage, ma seconde partie de stage
Problème menu dynamique [ par iutval ]
Bonjour, depuis plusieurs heures je suis bloqué sur un problème de menu dynamique. Voici ce que j'ai récupéré et modifié
Menu dynamique a gauche avec images [ par YouTzeEN ]
Salut à tous Bon, voila je suis un tres gros newbie ...Je cherche a faire un menu dynamique a gauche avec des images ...Voila en fait, j'aurai be
creation de menu dynamique avec une servlet? [ par youra2005 ]
Petit problème avec un menu dynamique ! [ par vernoff ]
Salut, je suis en train de créer un site comprenant au total trois menus dynamiques sur la meme page. J'ai mis le premier qui marche très bi
menu vertical dynamique [ par seabird ]
Bonjour, J'ai du mal à trouver ce script.Je recherche un menu vertical en arborescence , dynamique (permettant de derouler et enrouler:je souhait
Menu déroulant dynamique avec BDD [ par sebalex ]
Bonjour à tous,J'ai un menu déroulant affichant une liste d'article stocké dans une base de données (MYSQL). Je souhaite que lorqu
Affichage dynamique [ par Ma2004 ]
Bonjour à tous,J'ai une liste déroulante insérée dans une page htm (qui contient des logos, la date et l'heure, . . .). J'ai
Metre un menu dynamique haut dessus d'une frame [ par comtention ]
Bonjour,J'ai un menu dynamique et le probleme c'est que quand je le déroule on ne vois pas tout car la fram a coter passe par dessus. V
|
Derniers Blogs
PRATIQUE DE SILVERLIGHT PAR ERIC AMBROSIPRATIQUE DE SILVERLIGHT PAR ERIC AMBROSI par MPOWARE
Je viens de finir la lecture du dernier livre d'
Eric Ambrosi
Son livre donne une approche pratique de Silverlight qui sera aussi bien comprise par le développeur que par le designeur.
Tous les aspects du développement RIA sont abordés: animations, 3...
Cliquez pour lire la suite de l'article par MPOWARE APPRENDRE à DéVELOPPER POUR LES MOBILES AVEC LA NOUVELLE GéNéRATION .NETAPPRENDRE à DéVELOPPER POUR LES MOBILES AVEC LA NOUVELLE GéNéRATION .NET par odewit
2 déclinaisons de Silverlight et 2 déclinaisons de Mono permettent dorénavant (ou permettront prochainement) de développer des applications .NET mobiles pour les principales plates-formes du marché :
Silverlight pour Symbian, basé sur Silverlight 2...
Cliquez pour lire la suite de l'article par odewit ZUNE : NOUVELLE VERSION DU ZUNE SOFTWARE - V 4.2ZUNE : NOUVELLE VERSION DU ZUNE SOFTWARE - V 4.2 par ROMELARD Fabrice
Avec la dernière génération du lecteur MP3 de Microsoft, le ZUNE HD, Microsoft a publié une nouvelle version du logiciel pour PC. Ainsi, je me suis décidé à installer celle-ci sur mon Tablet PC ACER, comme toujours le logiciel est donc tél...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice L'INTERFACE NATURELLE DE WINDOWS PHONE 7 SERIESL'INTERFACE NATURELLE DE WINDOWS PHONE 7 SERIES par odewit
La tendance est aux interfaces naturelles (NUI), et le keynote de Bill Buxton au MIX l'a bien souligné.
La charte graphique et ergonomique de Windows Phone 7 a donc été entièrement repensée en vue d'obtenir un maximum d'efficacité sur ce point. En re...
Cliquez pour lire la suite de l'article par odewit
Logiciels
Academy System (10.9.4.0)ACADEMY SYSTEM (10.9.4.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System Xilisoft Convertisseur Vidéo Ultimate (5.1.39.0305)XILISOFT CONVERTISSEUR VIDéO ULTIMATE (5.1.39.0305)Xilisoft Convertisseur Vidéo Ultimate est un outil puissant de conversion vidéo, facile à utilise... Cliquez pour télécharger Xilisoft Convertisseur Vidéo Ultimate Xilisoft DVD Ripper Ultimate (5.0.64.0304)XILISOFT DVD RIPPER ULTIMATE (5.0.64.0304)Xilisoft DVD Ripper Ultimate est un logiciel excellent pour copier et convertir DVD vers presque ... Cliquez pour télécharger Xilisoft DVD Ripper Ultimate Rigs of Rods (63.3)RIGS OF RODS (63.3)c'est un jeu de multi-simulation camions,autobus voitures, avions, bateaux, hélicoptère avec défo... Cliquez pour télécharger Rigs of Rods
|