问题
which is positioned 113px from the top, to be on top when users are scrolling the page.
I know there is a similar question, but I am not sure where to put the js code. (Yes I am a newbie)
Old question: How to "fixed" menu only when it get to the top?
Let me know if you want to see an example.
Best regards
Carsten
回答1:
Here's an example on how to do this: http://jsfiddle.net/andunai/9x74vkvw/
I've also wrapped .menu
into a .menu-placeholder
div to reserve place for menu prevent page from "jumping" when it changes state.
You'll need 2 CSS definitions for your menu: .static
and .fixed
. Here's the example CSS:
.menu {
width: 100%;
margin: 0px 10%;
display: block;
}
.menu.floating {
position: fixed;
top: 0;
left: 10%;
width: 10%;
}
回答2:
Well, you can put you code in page head like:-
<html>
<head>
<script>
$(document).ready({
$(window).on('scroll', function(){
// instead of 113 use the scrollTop when the element touches the top of the window
if($(window).scrollTop()>=113){
$(element).css('position', 'fixed');
}
else $(element).css('position', 'relative');
});
});
</head>
<body>
// your stuff goes there.
</body>
</html>
回答3:
You don't need JS for this just use:
#idOftheDiv
{
position:fixed;
top:113px;
}
in your CSS.
来源:https://stackoverflow.com/questions/27294191/keep-menu-on-top-when-fixed-in-css