jquery image zoom

你好，我正在使用一个脚本放大悬停图像，但它从左上角放大，我需要它从中心悬停，我无法弄清楚如何将CSS添加到jQuery添加负边距，以便按照我希望的方式进行，这里是脚本。jquery image zoom

$('#sun').width(); 
$('#sun').mouseover(function(){ 
    $(this).css("cursor","pointer"); 
    $(this).animate({width: "7%"}, 'slow'); 
}); 
$('#sun').mouseout(function(){ 
    $(this).animate({width: "6%"}, 'slow'); 
});

我只想在“css边缘w x y z”但不能得到它/任何一个能够帮助？谢谢:)

来源

2013-03-27 jphillip724

你想动画毛利下降或只是添加它？ – 2013-03-27 19:55:14

以这种方式生成动画，它会显示为从图像中心放大而不是左上角。谢谢。 – jphillip724 2013-03-27 19:56:20

你可以用CSS3来做到这一点。将容器设置为一半尺寸，将图像设置为100％宽度，然后在悬停上添加缩放变换和过渡。 http://jsbin.com/uqovof/1/edit – elclanrs 2013-03-27 20:01:14

如果图像是绝对定位的，你可以这样做http://jsfiddle.net/8wGtp/。

$('#resize').on({ 
    mouseenter: function(){ 
     $(this).animate({width: '130px', height: '130px', top: '-=15px', left: '-=15px'}, 500); 
    }, 
    mouseleave: function(){ 
     $(this).animate({width: '100px', height: '100px', top: '+=15px', left: '+=15px'}, 500); 
    } 
});

来源

2013-03-27 19:58:22 Joe

谢谢这个是我需要的，但是他们绝对定位，再次感谢！ :) – jphillip724 2013-03-27 20:00:04

jquery image zoom

回答

相关问题