rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-01 13:24:25 +01:00
Code Issues Actions Packages Releases Activity

Utilised mixins rather than specific WebKit properties

Browse Source
This commit is contained in:
Hayden Bleasel 2014-03-15 18:30:09 +11:00
parent da044d9c69
commit 8ab6746cbe
2 changed files with 47 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
dist/css/bootstrap.css vendored
View File

@ -5776,6 +5776,47 @@ button.close {
bottom: 20px;
}
}
@media all and (-webkit-transform-3d) {
.carousel .item {
-webkit-transition: -webkit-transform .6s ease-in-out;
-o-transition: -o-transform .6s ease-in-out;
transition: transform .6s ease-in-out;
-webkit-backface-visibility: hidden;
-ms-backface-visibility: hidden;
-o-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-perspective: 1000;
-ms-perspective: 1000;
-o-perspective: 1000;
perspective: 1000;
}
.carousel .item.next,
.carousel .item.active.right {
left: 0;
-webkit-transform: translate3d(100%, 0, 0);
-ms-transform: translate3d(100%, 0, 0);
-o-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
.carousel .item.prev,
.carousel .item.active.left {
left: 0;
-webkit-transform: translate3d(-100%, 0, 0);
-ms-transform: translate3d(-100%, 0, 0);
-o-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
.carousel .item.next.left,
.carousel .item.prev.right,
.carousel .item.active {
left: 0;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
}
.clearfix:before,
.clearfix:after,
.dl-horizontal dd:before,

12
less/carousel.less
View File

@ -235,19 +235,19 @@
@media all and (-webkit-transform-3d) {
.carousel {
.item {
-webkit-transition: 0.6s -webkit-transform ease-in-out;
-webkit-backface-visibility: hidden;
-webkit-perspective: 1000;
.transition-transform(~'0.6s ease-in-out');
.backface-visibility(~'hidden');
.perspective(1000);
&.next, &.active.right {
-webkit-transform: translate3d(100%,0,0);
.translate3d(100%, 0, 0);
left: 0;
}
&.prev, &.active.left {
-webkit-transform: translate3d(-100%,0,0);
.translate3d(-100%, 0, 0);
left: 0;
}
&.next.left, &.prev.right, &.active {
-webkit-transform: translate3d(0%,0,0);
.translate3d(0%, 0, 0);
left: 0;
}
}