响应式网站菜单

时间:2014-05-05 19:33:43

标签: html css twitter-bootstrap

http://nggalaxy.ru/en/about-us/ - 这是要实现的确切行为的示例。向下滚动页面时,侧面菜单消失并显示在页面顶部。 例如,如何使用bootstrap实现它?

谢谢。

1 个答案:

答案 0 :(得分:2)

以下是原始Javascript + jQuery实现这一点的示例:

<script type="text/javascript">
$(window).scroll(function(){ 

var a = 112;
var pos = $(window).scrollTop();
if(pos > a) {
    $("menu").css({
                position: 'fixed'
            });
}
else {
    $("menu").css({
                position: 'absolute',
                top:'600px'
            });
}
});
</script>

如果用户向下滚动112像素,这将添加CSS样式。像这样你可以为你的菜单创建所有样式。

一般情况:使用javascript检查用户的滚动位置,并附加样式或类。