Javascript 在bxcarousel中重新绑定图像上的jQuery qtip工具提示

我用bxcarousel显示了一组图像。每个图像都有一个工具提示，我使用qtip显示

这在第一轮中效果很好，但当图像再次出现时，工具提示不再显示（因为bxcarousel删除了一个滑出的元素并将其放回末尾）

旋转木马的示例可在此处找到：

这是用于绑定事件的代码（可能它在某个地方需要一个“live”函数？）

---

qTip无法与

.live（）

事件一起正常工作。。。我试过这样的方法：

$('#shopcarousel a[rel]').live('mouseover', function(){... })

但是，它并没有很好地工作，因为有时您必须离开元素，然后返回以显示工具提示

更好的选择是使用与

.live（）

事件绑定的工具提示。我找不到很多，它们仍然是相对基本的：

（制作自己的教程）

（我不确定这是否设置为使用Ajax加载内容）

（来自此）

---

我最终为了类似的目的修改了bxCarousel。以下是我的步骤：

1.）将另一个属性（动画或回调）添加到默认对象。此属性应用于传递回调函数，该函数将在每个动画周期的末尾执行：

var defaults = {
    ...
    controls: true,
    animation_cb: null
};

2.）在“下一张幻灯片”和“上一张幻灯片”功能中添加选项检查：

function slide_next(){
    ...
    get_a();
    if (typeof options.animation_cb === "function") options.animation_cb();
    is_working = false;
    ...
}

以及：

3.）最后，在插件初始化调用中，传递要执行的回调函数。例如：

function doBar () {
    // whatever you need to happen after the slides have moved
    // like rebinding events, or what have you
}

$('ul.foo').bxCarousel({
    ...
    animation_cb: doBar
});

function slide_prev(){
    ...
    get_p()
    if (typeof options.animation_cb === "function") options.animation_cb();
    is_working = false;
    ...
}

function doBar () {
    // whatever you need to happen after the slides have moved
    // like rebinding events, or what have you
}

$('ul.foo').bxCarousel({
    ...
    animation_cb: doBar
});