Hover d'une DIV Javascript
Posté : 30 mai 2009, 11:33
Bonjour,
j'ai ce code qui me fait un auto suggest d'un champs de saisie.
Je ne sais pas comment definir le style de manière a ce que lorsque je survol un résultat, la couleur change
Merci d'avance
j'ai ce code qui me fait un auto suggest d'un champs de saisie.
Je ne sais pas comment definir le style de manière a ce que lorsque je survol un résultat, la couleur change
Merci d'avance
Code : Tout sélectionner
/*
tableau des reponses necessaires à la correspondance entre la suggestion et les données
Vous pouvez bien entendu le generer en php ou bien de facon dynamique avec ajax ;)
*/
/*
fonction de recalcul de l'offset top et left qui se refere à l'offsetParent pour palier au probleme de positionnement dans les tableaux
*/
function positionAbsolute(obj, mode)
{
currentValue = 0;
if (obj.offsetParent)
{
if (mode == 'top')
currentValue = obj.offsetTop;
else if (mode == 'left')
currentValue = obj.offsetLeft;
while (obj = obj.offsetParent)
if (mode == 'top')
currentValue += obj.offsetTop;
else if (mode == 'left')
currentValue += obj.offsetLeft;
}
return currentValue;
}
/*
la fonction principale qui remplis le div des differentes suggestions possibles en corélation avec le champ input
*/
function showValue(inside)
{
divDest = document.getElementById('menuRightHidden');
divDest.innerHTML = '';
valueOfElement = '';
exist = 0;
nbOfElement = 0;
divDest.style.top = positionAbsolute(inside, 'top') + inside.offsetHeight;
divDest.style.left = positionAbsolute(inside, 'left');
divDest.style.width = inside.offsetWidth - 3;
for (i = 0; i < suggests.length; i++)
{
if (suggests[i].indexOf(inside.value) == 0 && inside.value != '')
{
nbOfElement++;
exist = 1;
valueOfElement = suggests[i];
currentDiv = document.createElement("div");
currentInner = document.createTextNode(suggests[i]);
currentDiv.indice = suggests[i];
currentDiv.className = 'currentDiv';
currentDiv.onclick = function()
{
inside.value = this.indice;
divDest.style.visibility = 'hidden';
}
currentDiv.appendChild(currentInner);
divDest.appendChild(currentDiv);
}
}
if (exist == 0 || (valueOfElement.length == inside.value.length && nbOfElement == 1))
divDest.style.visibility = 'hidden'
else
divDest.style.visibility = 'visible';
}
/*
intialisation de la div qui contiendra les differentes suggestions
*/
function initMenuRightDiv()
{
menuRightDiv = document.createElement("div");
menuRightDiv.className = 'hiddenDiv';
menuRightDiv.id = 'menuRightHidden';
window.document.body.appendChild(menuRightDiv);
}
window.onload = initMenuRightDiv;