我需要添加平移到一些元素,问题是他们中的一些已经有旋转。我试图修改我的转换矩阵,但有时它有6有时16个元素。计划是translateX的项目宽度的一半。
var page = $("<div>");
this.pages.push(page);
page.css({
"-webkit-transform": "rotateY(180deg)",
"-webkit-transition-duration": "0.5s"
});
for (var i = 0; i < this.pages.length; i++) {
var matrix = this.pages[i].css("transform");
if (matrix != "none")
matrix = matrix.replace(/[^0-9\-.,]/g, '').split(',');
else
matrix = [ 1, 0, 0, 0, 1, 0 ];
var index = matrix.length == 16 ? 3 : 2;
matrix[index] = -0.5;
this.pages[i].css({ "transform": "matrix(" + matrix.join(",") + ")" });
}
1条答案
按热度按时间vcirk6k61#
以下是代码的工作版本,其中仅做了一些更改:
-webkit-
前缀来进行转换,十年来,每个浏览器都不带前缀地支持transform
。each()
方法,而不是for循环。只需向它传递一个函数,该函数将在集合中的每个对象上运行。该函数将被传递一个索引和this
元素。对工作片段进行了进一步注解: