如何使用jquery UI在选择选项之上创建图像工具提示？

Question

我有一个选择框

<select name="template" id="id_template">
  <option value="" selected>---------</option>
  <option value="1">twobytwo</option>
  <option value="6">twovert</option>
  <option value="7">twohoriz</option>
</select>

我有每个选择的图像

/static/img/twobytwo.png

/static/img/twovert.png

/static/img/twohoriz.png

如何创建工具提示，以便当用户将鼠标悬停在选项上时，它会显示与该选项关联的图像？我发现的只是近在咫尺但并不完全http://jsfiddle.net/ndrDc/151/

由于

Answer 1

在select div上设置“size”属性，然后：

$(function () {
    $(document).tooltip({
        items:"select#id_of_your_select,option",
        content : function(){
                return '<img src="my_image.png" width="50px"/>'
        },
    });
});