1

我有一个基本的 jquery 脚本，当图像悬停时会向上推图像。悬停有时无法按预期工作。我想知道我是否可以在我的脚本中添加任何其他内容以使其始终按预期运行，而不仅仅是间歇性地运行。

jQuery(document).ready(function() {

    $("#image-list a").hover(function() {
            $(this).stop().animate({ marginTop: "-10px" }, "fast");
            $(this).parent().find("span").stop().animate({ marginTop: "18px", opacity: 0.25 }, "fast");
        },function(){
            $(this).stop().animate({ marginTop: "0px" }, "fast");
            $(this).parent().find("span").stop().animate({ marginTop: "1px", opacity: 1 }, "fast");
        });     


    // create custom animation algorithm for jQuery called "bouncy"
    $.easing.bouncy = function (x, t, b, c, d) {
        var s = 1.70158;
        if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
        return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
    }

    // create custom tooltip effect for jQuery Tooltip
    $.tools.tooltip.addEffect(
        "bouncy",

    // opening animation
    function(done) {
        this.getTip().animate({top: '+=10'}, 300, 'bouncy', done).show();
    },

    // closing animation
    function(done) {
        this.getTip().animate({top: '-=10'}, 50, 'bouncy', function()  {
        $(this).hide();
        done.call();
        });
    }
    );                                          

    $("a.cat-pics img[title]").tooltip({effect: 'bouncy'});

 });

HTML

    <ul id="image-list">
<li class=""><a class="cat-pics" href="http://www.greatshield.com/dev/products/devices/apple/"><img src="<?php echo bloginfo('template_url'); ?>/images/iphone-5.jpg" title="iPhone 5"/></a></li>
</ul>

链接 http://www.greatshield.com/dev/products/device-type/smartphones/

4

1 回答 1

0

您将工具提示应用于img，但将鼠标悬停在a

而不是悬停在a尝试悬停img

$("#image-list img").hover(function() {

或者至少使两者都以一种或另一种方式相同。我认为img利润把你搞砸了。

于 2013-08-15T16:54:25.853 回答