Rechercher : dans
Par :

Expand DIV avec javascript

Dernière réponse le 12 mai 2008 à 18:02:58 ms_vinc, le 26 fév 2008 à 17:04:58 
 Signaler ce message aux modérateurs

Bonjour,

Je ne m'y connais absolument pas en Javascript, j'arrive à comprendre plus ou moins en lisant le code, mais en taper/modifier un .. c'est autre chose :)

Voila donc ce que j'aimerais faire:

5 div (width:25px , height:600px) modelisant le menu de mon futur site. Chaque div sera donc une rubrique.
Lors du passage de la souris sur une div, j'aimerais que celle ci s'allonge (plus grand height..).
Pour cela,j'ai trouvé un script que voila:

<HTML>
<HEAD>
<SCRIPT language="javascript">
<!--
var t;
var p = "q";
var x = 100;
var y = 500;
var q = 5;
var g = 0;


function changeheight(){
if(y>550&&g==0){g=1;return;}
if(y<501&&g==1){g=0;return;}
if(g)q=-5;if(!g)q=5;y=y+q;
e=document.getElementById("u");
e.style.height = y + 'px';
t=setTimeout("changeheight();",0);
}

// -->
</SCRIPT>
</HEAD>
<BODY>

<div id="u" style="position:absolute; top:130px; left:500px; width:20px; height:500px; background-color:yellow; text-align:center;"><a href="javascript:void(0)" onMouseOver="changeheight()" onClick="" onMouseOut="">t</a></div><BR>
<BR>
<BR>
</BODY>
</HTML>


(il y a peut etre encore des var en trop, le script possedait encore d'autres fonctions, que j'ai supprimé)

Ce que je voudrais, c'est que la div s'allonge au passage de la souris (et non pas sur le passage du texte), et qu'elle reprenne la taille originale au onmouseout.
Le changement de couleur doit-il etre inclu dans le script ? ou dans le code html/css ?

Je n'ai absolument aucune idée comment je pourrais réaliser cela, et les recherches sur mon ami google n'a pas vraiment apporté de résultats :-(
Help !

Merci d'avance,

Cordialement, ViNc

Configuration: Windows XP
Firefox 2.0.0.12

Meilleures réponses pour « Expand DIV avec javascript » dans :
Javascript - Modifier la hauteur (height) d'un élément HTML VoirPour modifier la hauteur d'un élément HTML en javascript, il suffit d'utiliser sa propriété de style "height". Pour cela vous pouvez y faire référence de la manière suivante : Si vous souhaitez connaître la hauteur (height) d'un bloc HTML, il...
Créer une DIV avec transparence VoirLes DIV transparents en CSS Vous voulez rendre une DIV transparente ? Rien de plus simple, il suffit d'utiliser une des techniques CSS suivantes : Rendre le DIV ainsi que le contenu transparent Le div lui même sera transparent, mais aussi...
Javascript - Librairies d'effets pour vos images VoirAu gré de vos explorations du web, vous avez vu de superbes effets de présentation des images. Et ça vous plairaît bien de pouvoir proposer les mêmes à vos visiteurs. Voici quelques solutions en Javascript couplées à des CSS. Elles sont plus...
Javascript - Les événements VoirQu'appelle-t-on un événement? Les événements sont des actions de l'utilisateur, qui vont pouvoir donner lieu à une interactivité. L'événement par excellence est le clic de souris, car c'est le seul que le HTML gère. Grâce au Javascript il est...
Javascript - Les variables VoirLe concept de variable Une variable est un objet repéré par son nom, pouvant contenir des données, qui pourront être modifiées lors de l'exécution du programme. En Javascript, les noms de variables peuvent être aussi long que l'on désire,...
Javascript - L'objet Date VoirLes particularités de l'objet Date L'objet Date permet de travailler avec toutes les variables qui concernent les dates et la gestion du temps. Il s'agit d'un objet inclus de façon native dans Javascript, et que l'on peut toujours utiliser. La...

1

ms_vinc, le 27 fév 2008 à 19:47:18

Help ?

Répondre à ms_vinc

2

 sanasidalo, le 12 mai 2008 à 18:02:58

Slt j'ai le même prob mé j'ai pas trouvé la solution qulq'un m'aidéé

Répondre à sanasidalo