Skip to content

Instantly share code, notes, and snippets.

@zz-james
Last active January 3, 2016 17:39
Show Gist options
  • Save zz-james/8496736 to your computer and use it in GitHub Desktop.
Save zz-james/8496736 to your computer and use it in GitHub Desktop.
transform matrix
<!DOCTYPE html>
<html>
<head>
<title>transform</title>
<style>
#t1 {width:100px; /*line length*/ height:1px; /*line thickness*/}
#t2 {width:1px; /*line thickness*/ height:100px; /*line length*/ }
</style>
</head>
<body>
<div id='t1' class='transform'></div>
<div id='t2' class='transform'></div>
</body>
</html>
.transform{
background:#000;
transform-origin: 0 0;
transform: matrix(1,0, 0,1, 100,100);
}
/* matrix (a, b, d, e, c, f); */
/*
[ x ] = ax + by + c [ a, b, c ] [a, b, d]
[ y ] = dx + ey + f [ d, e, f ] [e, c, f]
[ 1 ] [ 0, 0, 1 ]
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment