I've got the following situation. I need to show a tooltip with custom text when the mouse cursor is over the combobox items (over the "option" tag). My first idea to resolve this was using the title tag. It has worked well with Firefox, but with IE, when the text is too large, it got truncated.
Then, I thought about using a div as a tooltip, and show/hide it. I've created the following code, and it works on Firefox (the enter and leave events are triggered), but again in IE they don't do nothing.
$(document).ready(function () {
var $tooltip = $("#tooltip").hide();
var $options = $("#ddlSelect option");
$options.each(function () {
var texto = $(this).attr("title");
$(this).data("title", t开发者_StackOverflowexto);
$(this).attr("title", "");
});
$options.hover(function () {
var texto = $(this).data("title");
if (texto != "")
$tooltip.show().text(texto);
}, function () {
$tooltip.hide();
});
});
Obs. "tooltip" is a div. "ddlSelect" is a combobox with some options. All its "option" have a title tag associated, just to be the initial container of the custom text.
I'm using IE 8. Does anyone knows why IE can't triggers these events?
Thanks
I might suggest this example from jQuery UI:
http://jqueryui.com/demos/autocomplete/#combobox
You'll then have to dip in to the plugin code to add a mouseover event setter for your options.
精彩评论