Skip to content

Instantly share code, notes, and snippets.

@ezekielriva

ezekielriva/index.html

Last active December 19, 2015 15:29
Show Gist options
  • Save ezekielriva/5976400 to your computer and use it in GitHub Desktop.
Save ezekielriva/5976400 to your computer and use it in GitHub Desktop.
Download ZIP
Slider menu
Raw
index.html
<body>
<nav class="hidden-desktop">MI MENU</nav>
<div class="sliderpage">
SLIDE
</div>
</body>
Raw
script.coffee
# Preparación del lugar a slide
pageheight = $('.slidepage').height();
if(pageheight > $(document).height() && $(document).width() < 940 )
$('body').height(pageheight)
$('.fixed-footer').css('position','absolute')
$('.fixed-footer').css('bottom','0px')
else
$('body').height($(document).height() )
# Disparador del evento
$('#btn-navbar').on 'click', (e) ->
e.preventDefault()
$('.slidepage').toggleClass('slidepage-wrapper')
$('.nav-mobile-collapse').height( $(document).height() )
$('.nav-mobile-collapse').toggleClass('nav-mobile-collapse-wrapper')
Raw
slider-page.css
.slidepage-wrapper {
left: -200px;
position: fixed;
transition: left 0.6s ease 0s;
}
.slidepage {
display: block !important;
left: 0;
position: absolute;
top: 0;
transition: left 0.6s ease 0s;
width: 100%;
}
.nav-mobile-collapse {
background-color: #252424;
left: inherit;
position: absolute;
right: -200px;
transition: right 0.6s ease 0s;
width: 200px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment