0

我正在尝试使用回调函数创建悬停效果。似乎只能在回调函数上触发效果，而不能在init悬停上触发。我想知道这里是否有人可以帮助我。非常感谢。

$("img").live("hover", function () {
    // hover in
    $(this).css("z-index", 1);
    $(this).animate({
        height: "35%",
        width: "35%",
        left: "-=50",
        top: "-=50"
    }, "fast");
}, function () { //only the following codes will be triggered.
    // hover out
    $(this).css("z-index", 0);
    $(this).animate({
        height: "15%",
        width: "15%",
        left: "+=50",
        top: "+=50"
    }, "fast");
});

img 是通过 ajax 调用生成的，不确定是否相关

<div id='image_layout'>
    <img src='a.jpg' />
    <img src='b.jpg' />
    <img src='c.jpg' />
</div>
4

2 回答 2

3

live()已弃用，它并没有真正那样工作，但如果您使用的是 jQuery 1.7+，您应该使用on()将事件委托给最近的非动态父级，我将document在示例中使用，您将替换document为最接近未使用 Ajax 插入的图像的父级，可能是#image_layout如果该元素未动态插入：

$(document).on({
    mouseenter: function() {
        $(this).css("z-index", 1).animate({
                height: "35%",
                width: "35%",
                left: "-=50",
                top: "-=50"
            }, "fast");
    },
    mouseleave: function() {
        $(this).css("z-index", 0).animate({
                height: "15%",
                width: "15%",
                left: "+=50",
                top: "+=50"
            }, "fast");
    }
}, "img");

另一方面，+=在你的动画中使用和百分比在很多情况下只会让你感到悲伤。

于 2012-08-02T17:01:17.727 回答
1

从 jQuery 1.7 开始，不推荐使用 .live() 方法。使用 .on() 附加事件处理程序。旧版本 jQuery 的用户应该使用 .delegate() 而不是 .live()。

试一下！

您的参数也错误，第二个参数应该是数据 nog 某种回调，请参阅更多信息：http ://api.jquery.com/live/

于 2012-08-02T17:01:47.700 回答