jquery - 使用 JQuery 反射（jsfiddle）时调整图像大小

Question

我正在尝试使用 JQuery 反射功能，但遇到了一些麻烦。反射功能在我尝试将类添加到的任何图像上都可以正常工作，但是，它仅在我不修改图像大小的情况下才有效。

一旦我尝试调整我正在应用反射的图像的大小，我尝试应用到它的大小被忽略并且一些图像被切断......我想知道调整我的图像大小的正确方法是什么正在应用反射？

jsFiddle

http://jsfiddle.net/suxcd/

注意：如果您删除“width:50%”，则反射效果很好，并且整个图像会按原样显示。

Answer 1

这是可能的，但它仅在您使用反射的所有图像使用百分之一值时才有效（或者您必须使用 ID）。

无论如何，这是更新的 fiddle。

最重要的代码：编辑文档就绪代码：

$(document).ready(function() {
    var options = {
        opacity: 0.75
    };
    $('.reflect').reflect(options);
    $('.reflected').parent('.reflect').children('canvas').width('50%');
});​

Answer 2

您正在按百分比调整大小，如果您使用定义的数字，它可以工作

http://jsfiddle.net/suxcd/1/

我想问题是你需要它在 %

编辑：

见这里http://jsfiddle.net/suxcd/3/

基本上，我改变了这个

h.scale(0.5, -1);

0.5 与 50% 相同，您可以轻松地将 0.5 设置为动态值。获取 img 标签上的宽度属性，如果有 % 则抓取数字将其转换为十进制并在那里使用它。如果没有 % 那么不要改变它