Question

我写了一个jquery函数来缩放图像。第一行隐藏所有图像，最后一行缩放当前图像。在我之间，我已经编写了基于逻辑的代码，用于在中心显示图像。但它不起作用，任何人都可以帮忙吗？

     $("img").animate({opacity: "0.001", left: '0px'})

     var imgPosX = ( $(window).width() - $("this").width() )/2; 
     var imgPosY = ( $(window).height() - $("this").height() )/2; 

     $(this).css({"top": imgPosY+"px", "left": imgPosX+"px"}); 
     $(this).animate({opacity:"1", zoom: '150%'}, 'medium');},

Answer 1

删除"周围的this：

 var imgPosX = ( $(window).width() - $(this).width() )/2;
 var imgPosY = ( $(window).height() - $(this).height() )/2;

this是JavaScript中的关键字，不是字符串。

Answer 2

我建议使用jQuery插件，因为它们很容易找到并且几乎可以做任何你要求的事情。看看this example可能的替代方案。这样做的另一个好处是，当您将鼠标移过鼠标时，可以使用缩略图并加载完整的照片（避免一次下载所有全尺寸图像）。

Answer 3

不要改变顶部和左侧，而是尝试 margin-left和margin-right

Answer 4

尝试此工作DEMO

$(function(){

    $("img").css({opacity: "0.001", left: '0px'});

    objthis= $("img").eq(0);
     var imgPosX = ( $(window).width() - objthis.width() )/2; 
     var imgPosY = ( $(window).height() - objthis.height() )/2; 

     objthis.css({"position":"relative","top": imgPosY+"px", "left": imgPosX+"px"}); 
     objthis.animate({opacity:"1", zoom: '150%'}, 'medium'); 
});

中心在点击后缩放图像（JQuery）

4 个答案: