我正在尝试使用 JQuery 反射功能,但遇到了一些麻烦。反射功能在我尝试将类添加到的任何图像上都可以正常工作,但是,它仅在我不修改图像大小的情况下才有效。
一旦我尝试调整我正在应用反射的图像的大小,我尝试应用到它的大小被忽略并且一些图像被切断......我想知道调整我的图像大小的正确方法是什么正在应用反射?
jsFiddle
注意:如果您删除“width:50%”,则反射效果很好,并且整个图像会按原样显示。
我正在尝试使用 JQuery 反射功能,但遇到了一些麻烦。反射功能在我尝试将类添加到的任何图像上都可以正常工作,但是,它仅在我不修改图像大小的情况下才有效。
一旦我尝试调整我正在应用反射的图像的大小,我尝试应用到它的大小被忽略并且一些图像被切断......我想知道调整我的图像大小的正确方法是什么正在应用反射?
jsFiddle
注意:如果您删除“width:50%”,则反射效果很好,并且整个图像会按原样显示。
这是可能的,但它仅在您使用反射的所有图像使用百分之一值时才有效(或者您必须使用 ID)。
无论如何,这是更新的 fiddle。
最重要的代码:编辑文档就绪代码:
$(document).ready(function() {
var options = {
opacity: 0.75
};
$('.reflect').reflect(options);
$('.reflected').parent('.reflect').children('canvas').width('50%');
});
您正在按百分比调整大小,如果您使用定义的数字,它可以工作
我想问题是你需要它在 %
编辑:
见这里http://jsfiddle.net/suxcd/3/
基本上,我改变了这个
h.scale(0.5, -1);
0.5 与 50% 相同,您可以轻松地将 0.5 设置为动态值。获取 img 标签上的宽度属性,如果有 % 则抓取数字将其转换为十进制并在那里使用它。如果没有 % 那么不要改变它