Question

我正在使用jquery jRumble插件。我想将鼠标悬停在h3包裹上并使图像隆隆声

这是我的HTML：

<div class="b-wrap cf">
<div class="b">
    <img src="#" alt="Zermatt Icon" />
</div>
<div class="b-r two">
    <h3><a href="#">Zermatt</a></h3>
</div>
</div>

这是我的jquery：

$(document).ready(function() {

$( ".b-r" ).hover(function() {

    $('.b img').jrumble({
        x: 2,
        y: 2,
        rotation: 1,
    speed: 75
    });

    $('.b img').hover(function() {
        $(this).trigger('startRumble');
    }, function() {
        $(this).trigger('stopRumble');
    });
});
});

我必须错过显而易见的事情，非常感谢你的投入。

干杯。

Answer 1

问题是您是在$('.b-r')而不是$('.b img')

上触发功能

$(document).ready(function () {
   $('.b img').jrumble({
      x: 2,
      y: 2,
      rotation: 1,
      speed: 75
    });

    $('.b-r').hover(function () {
       // here $(this) refers to $('.b-r') 
       $('.b img').trigger('startRumble');
       }, function () {
            $('.b img').trigger('stopRumble');
    });
});

Answer 2

$(document).ready(function() {

   $('.b img').jrumble({
        x: 2,
        y: 2,
        rotation: 1,
    speed: 75
    });

   $('.b-r').hover(function() {
        $('.b img').trigger('startRumble');
    }, function() {
        $('.b img').trigger('stopRumble');
    });

});

jQuery jRumble插件 - 悬停时的隆隆声

2 个答案: