Skip to content

Instantly share code, notes, and snippets.

@takanorip
Created October 13, 2016 12:57
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save takanorip/a48d3f4b91e40ea76eaaf379bd96bdfb to your computer and use it in GitHub Desktop.
Header
<header>header</header>
<div id="sub_header" class="sub">sub</div>
<main>main</main>
$(window).on('scroll', function() {
var topInitial = $('#sub_header').offset().top;
var topPosition = 100 - $(window).scrollTop();
if (topPosition > 0) {
$('.sub').css('top', topPosition);
} else if(topPosition <= 0) {
$('.sub').css('top', 0);
}
});
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
* {
margin: 0;
padding: 0;
}
header {
height: 100px;
background: #ddf;
}
.sub {
display: block;
width: 100%;
height: 50px;
background: #ade;
position: fixed;
top: 100px;
}
main {
height: 2000px;
padding-top: 50px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment