Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!-- HTML -->
- <a href="#" class="toggle-mnu hidden-lg"><span></span></a>
- <!-- SASS -->
- .toggle-mnu
- display: block
- width: 28px
- height: 28px
- margin-top: 14px
- span:after, span:before
- content: ""
- position: absolute
- left: 0
- top: 9px
- span:after
- top: 18px
- span
- position: relative
- display: block
- span, span:after, span:before
- width: 100%
- height: 2px
- background-color: #fff
- transition: all 0.3s
- backface-visibility: hidden
- border-radius: 2px
- &.on span
- background-color: transparent
- &.on span:before
- transform: rotate(45deg) translate(-1px, 0px)
- &.on span:after
- transform: rotate(-45deg) translate(6px, -7px)
- <!-- jQuery -->
- $(".toggle-mnu").click(function() {
- $(this).toggleClass("on");
- $(".main-mnu").slideToggle();
- return false;
- });
Add Comment
Please, Sign In to add comment