jQueryUI工具提示为不同的类设置不同的位置

jQueryUI tooltip set different positions for different classes

本文关键字:设置 位置 工具提示 jQueryUI      更新时间:2023-09-26

我只是按照这个指令让jQueryUI工具提示通过ajax加载内容。(小提琴)(全屏)。问题是我无法为第二个工具提示(.loadtip)设置与第一个不同的位置。谁能告诉我是否可以覆盖第一个工具提示的位置?

代码:

   $(document).tooltip({
            items: "[data-info]",
            position: {
        my: "left+70 top",
        at: "center top",
    },
        content: function () {
            return $(this).data('info');
        },
        show: null, 
        close: function (event, ui) {
            ui.tooltip.hover(
            function () {
                $(this).stop(true).fadeTo(400, 1);
            },
            function () {
                $(this).fadeOut("150", function () {
                    $(this).remove();
                })
            });
        }
    });

    $('.loadtip').tooltip({
        position: {
            my: "right top",
            at: "center top-10"
        },
         content:function(callback) { 
    var loadfile = $('.loadtip').data("info");
           $.get(loadfile,{}, function(data) {
             callback(data); 
            });
           },

      });

可以在初始化时设置位置。例如,如果您有两个类,'class-a'和'class-b',那么可以为这两个类设置不同的位置,如下所示:

$( ".class-a" ).tooltip({ position: { my: "left+30 center", at: "right center" } });
$( ".class-b" ).tooltip({ position: { my: "left+15 right", at: "right right" } });