Skip to content

Commit c8cfacc

Browse files
committed
Merge pull request #2 from bbjay/gh-pages
non-blurry 3d perspective
2 parents 52ba287 + 60e06cd commit c8cfacc

File tree

1 file changed

+10
-3
lines changed

1 file changed

+10
-3
lines changed

index.html

+10-3
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@
4646
x -= 90;
4747
break;
4848
}
49-
cube.style[_config.transformProperty] = 'rotateX(' + x + 'deg) rotateY(' + y + 'deg)';
49+
cube.style[_config.transformProperty] = 'translateZ(-160px) rotateX(' + x + 'deg) rotateY(' + y + 'deg)';
5050
};
5151
})();
5252

@@ -133,8 +133,12 @@
133133
#stage {
134134
height: 100%;
135135
width: 100%;
136-
/* workaround to make transformed elements accessible */
137-
-webkit-perspective: 999999;
136+
-webkit-perspective: 800px;
137+
-moz-perspective: 800px;
138+
perspective: 800px;
139+
-webkit-perspective-origin: 50% 70%;
140+
-moz-perspective-origin: 50% 70%;
141+
perspective-origin: 50% 70%;
138142
}
139143

140144
#cube {
@@ -151,6 +155,9 @@
151155
-webkit-transition: all 300ms ease-in;
152156
transform-style: preserve-3d;
153157
transition: all 300ms ease-in;
158+
-moz-transform: translateZ(-160px);
159+
-webkit-transform: translateZ(-160px);
160+
transform: translateZ(-160px);
154161
}
155162

156163
.side {

0 commit comments

Comments
 (0)