How do i fire a click continuously while something is hovered?

问题

Im pretty sure this has a simple solution. I am using jCarousellite, and i want to change the behaviour of built in nav buttons to fire on hover over.

$("#carousel").jCarouselLite({


 vertical: true,
 btnNext: ".btn-down",
 btnPrev: ".btn-up",
 visible:6,
 circular: false

});

$("#carousel .btn-down").hover(function() {

 $("#carousel .btn-down").click();

});

but it only fires once when mouseover, i need it to fire continueously while mouseover.

回答1:

var nav = function() {
  $("#carousel .btn-down").click(); // next move
  $("#carousel").data(
    'hover', 
    window.setTimeout(nav, 1000); // continue in 1000 ms
  );
};
$("#carousel .btn-down").hover(
  nav,
  function() {
    window.cancelTimeout ($("#carousel").data('hover')); // stop the navigation
  }
);

回答2:

I too had the same problem with my code, then I came up with this solution..

$(document).ready(function(){
    $("someid1").hover(function a() {  //on hover over some element with id-> someid1  
        $("#someid2").animate({
            width:"+=10" 
        }, function(){
            a();
        });
    }); //execute animation function and call itself again and again on mouseover
});                                                     

$("someid1").mouseout(function() {
    $("#someid2").stop(); //stop the animation on mouseout.
});
});

That did the trick for me. Hope it helps you.

回答3:

You can use setInterval to begin triggering the event at regular intervals on hover and use clearInterval to stop it when the user stops hovering. It'd also be cleaner to trigger the actual behavior you want instead of triggering a click event, assuming the plugin you're using supports such an API. Something like this:

var effectInterval;

$('#carousel .btn-down').hover(function() {
  effectInterval = setInterval(function() {
    $('#carousel').advanceToNextImage(); // sample API call, check your plugin's docs for how it might actually be done
  }, 5000);
}, function() {
  clearInterval(effectInterval);
});

回答4:

You can set an interval for clicking like this, just do the same for the opposite button:

$("#carousel .btn-down").hover(function() {
  $(this).data("to", setInterval(function() { $("#carousel .btn-down").click(); }, 200));
}, function() {
  clearInterval($(this).data("to"));
});

来源：https://stackoverflow.com/questions/2429790/how-do-i-fire-a-click-continuously-while-something-is-hovered

标签

jquery

hover

mouseover

jcarousel