diff options
| -rw-r--r-- | styles.css | 70 |
1 files changed, 70 insertions, 0 deletions
@@ -87,7 +87,77 @@ label[for=navbar-toggle-cbox] { #navbar-toggle-cbox:checked ~ .navbar-menu { display: block; + -webkit-animation: bounceInDown 1s both; + -moz-animation: bounceInDown 1s both; + -o-animation: bounceInDown 1s both; + animation: bounceInDown 1s both; } + +@-webkit-keyframes bounceInDown { + 0% { + opacity: 0; + -webkit-transform: translateY(-2000px); + } + 60% { + opacity: 1; + -webkit-transform: translateY(30px); + } + 80% { + -webkit-transform: translateY(-10px); + } + 100% { + -webkit-transform: translateY(0); + } +} +@-moz-keyframes bounceInDown { + 0% { + opacity: 0; + -moz-transform: translateY(-2000px); + } + 60% { + opacity: 1; + -moz-transform: translateY(30px); + } + 80% { + -moz-transform: translateY(-10px); + } + 100% { + -moz-transform: translateY(0); + } +} +@-o-keyframes bounceInDown { + 0% { + opacity: 0; + -o-transform: translateY(-2000px); + } + 60% { + opacity: 1; + -o-transform: translateY(30px); + } + 80% { + -o-transform: translateY(-10px); + } + 100% { + -o-transform: translateY(0); + } +} +@keyframes bounceInDown { + 0% { + opacity: 0; + transform: translateY(-2000px); + } + 60% { + opacity: 1; + transform: translateY(30px); + } + 80% { + transform: translateY(-10px); + } + 100% { + transform: translateY(0); + } +} + /* --------- End Menu Mobile sin JS ----------- */ /* --------- Menu Mobile JS ------------ */ |