jquery hover event doesn't work with select option tag in google chrome?

Question

I have a simple select tag

   <select>
        <option value="a">a</option>
        <option value="b">b</option>
        <option value="c">c</option>
        <option value="d">d</option>
    </select>

I want add hover event on option

   $('select option').hover(function(){
        console.log($(this).val());
    },function(){
        console.log("mouse out");
    });

However, it only works in Firefox, not in Chrome. How can I solve this problem? Is it a bug in jquery? Is there some hack?

Answer 1

hover event will not fire for option elements in Chrome and IE, might be in other browsers as well. You could try using some custom script for that: http://peterned.home.xs4all.nl/csshover.html