diff options
author | XhmikosR <xhmikosr@gmail.com> | 2019-02-08 19:08:40 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2019-02-08 19:08:40 +0300 |
commit | c56b10c14756222c4921c790703348eb8239bc95 (patch) | |
tree | 222482249e849b612f7d79b8cde89172e0f5a108 | |
parent | 52e6ce45123aa947c8b911c56b673f106ff0ee58 (diff) |
Offcanvas example: transition the transform (#28203)
This is more efficient than transitioning the `left` property.
-rw-r--r-- | site/docs/4.2/examples/offcanvas/offcanvas.css | 9 |
1 files changed, 5 insertions, 4 deletions
diff --git a/site/docs/4.2/examples/offcanvas/offcanvas.css b/site/docs/4.2/examples/offcanvas/offcanvas.css index 22de95a411..9c78f02e5e 100644 --- a/site/docs/4.2/examples/offcanvas/offcanvas.css +++ b/site/docs/4.2/examples/offcanvas/offcanvas.css @@ -19,13 +19,14 @@ body { overflow-y: auto; visibility: hidden; background-color: #343a40; - transition-timing-function: ease-in-out; - transition-duration: .3s; - transition-property: left, visibility; + transition: visibility .3s ease-in-out, -webkit-transform .3s ease-in-out; + transition: transform .3s ease-in-out, visibility .3s ease-in-out; + transition: transform .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out; } .offcanvas-collapse.open { - left: 0; visibility: visible; + -webkit-transform: translateX(-100%); + transform: translateX(-100%); } } |