¿Cómo mostrar información sobre herramientas para una lista de selección html usando el teclado en lugar del mouse?

i have created the following html code and JQuery Script

<select id="myId" name="myName" onmouseover="createToolTip('myName')">
    <option value="value_1" title="My first tooltip">option to select 1</option>
    <option value="value_2" title="My second tooltip">option to select 2</option>
    <option value="value_3" title="My third tooltip">option to select 3</option>
    <option value="value_4" title="My fourth tooltip">option to select 4</option>
</select>

function createToolTip(name){   

    var tooltips = {
        'value_1': 'option to select 1',
        'value_2': 'option to select 2',
        'value_3': 'option to select 3',
        'value_4': 'option to select 4'
    };

    var selector = "[name=" + name + "] option";                    
    jQuery(selector).each(function() {
        $(this).attr('title', tooltips[$(this).val()]);
    });         
};

If i scroll with my mousecursor over the option field, a specific tooltip for this option element will be visible.

But is it possible to show a tooltip, if i only navigate with the keyboard (arrow cursors) over the option list? Or is a tooltip only visible, if i use my mouse? Which event must be used for this (onfocus doesn´t work for example)

Gracias !

preguntado el 28 de mayo de 14 a las 11:05

tool-tip only happens in mouse over event ,that's native property.you could rely on jquery tool-tip plugins in this case -

1 Respuestas

How about onfocus event ? Did you try it. I believe onfocus would work both with mouse as well as keyboard.

contestado el 28 de mayo de 14 a las 12:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.