如何使用jQuery将鼠标悬停70％以上

Question

我希望jQuery colorbox在鼠标悬停时打开图片并在mouseout上关闭。 你能建议我怎么做吗？

Answer 1

这可以让你开始......

HTML

<img src="a.jpg" alt="b" />

的jQuery

$('img').hover(function() {
    $(this).stop().animate({ width: '170%' }, 500);
}, function() {
    $(this).stop().animate({ width: '100%' }, 500);
});

Answer 2

我会做这样的事情：

 $(function(){
  function fatOnHover($elements, zoomSize, animationSpeed){
  $elements.each(function(i){
     var $wrap, height, width, bigWidth, bigHeight, $that = $(this);
     height = $that.height();
     width = $that.width();
     bigWidth = (width / 100) * zoomSize;
     bigHeight = (height / 100) * zoomSize;
      $wrap = "<div style='z-index: " + (10000-i) +";width: " + width + "px; height: " + height + "px; position: relative; float: left'></div>",
      $that.data({"width": width, "height": height, "bigWidth": bigWidth, "bigHeight": bigHeight})
          .wrap($wrap)
   }).hover(
     function(){
        var $that = $(this);
        $that.stop().animate({"width": $that.data("bigWidth"), "height": $that.data("bigHeight")}, animationSpeed)
     },
     function(){
        var $that = $(this);
        $that.stop().animate({"width": $that.data("width"), "height": $that.data("height")}, animationSpeed)
     }
  ).css("position", "absolute")
   }


fatOnHover($('img'), 120, 300)
})

您可以在此处测试：http://jsfiddle.net/GHuNF/1/