4

我正在寻找一种方法来使我的动态缩放图像适合我正在制作的图像映射。我正在使用 jquery 来缩放具有窗口大小的图像：

$(window).bind("load resize", function(){

        $(".post img").height($(window).height()-110);
        $(".post img").width(($(".post img").newHeight() / $(".post img").oldHeight()) * $(".post img").oldWidth());

});

但是我制作的 ImageMaps 保持原始大小。我正在寻找 ImageMapster，但无法弄清楚如何自动使所有图像映射缩放。

这是它的页面：http: //www.dersuawesome.com/home/

4

1 回答 1

3

在你使用的imagemapster中： $('img').mapster('resize',width,height,duration);

来自原始 imagemapster 文档的引用：

$('img').mapster('resize',width,height,duration); --- 图像：图像的新宽度或高度：图像的新高度持续时间：（可选）0 | 毫秒（为调整大小设置动画）这会将图像映射调整为指定的尺寸。请注意，应传递宽度>或高度，另一个将以与原始图像相同的纵横比进行计算。如果两者都通过，则仅使用宽度来计算新尺寸：比例必须与原始图像保持相同。

引用结束。例如。当图像应变为 900 像素宽时，您可以使用：

$('img').mapster('resize',900,null,2000);

在这里，我告诉 imagemapster 使用 2000 毫秒来调整大小以获得平滑的效果。将其放入代码的 onconfigured-section 对我来说效果很好：

onConfigured: function(){
         $('img').mapster('resize',900,null,2000);
        } ,
于 2012-07-29T07:08:47.887 回答