滚动下来的粘性菜单中的元素

时间:2017-02-18 18:05:14

标签: html css wordpress menu sticky

嗨:)我有点暗示要在这里发帖,但我在我的智慧结束。

我正在使用wordpress和一个主题 - 蛋糕 - 用于公司网站。

我正在尝试定位一个动态按钮,以便与粘性包装器(.menu_wrapper)中的wordpress菜单对齐。无论我做什么 - 浮动,显示等 - 按钮在滚动时略微跳跃。代码在正确的位置,但我不能将此按钮指定为与wordpress菜单项相同的类 - 这是一个限制(我认为)。我宁愿只用CSS就能保持这个位置。

我是一个自学成才,随时随地学习,投入这个人并且我正在尽力而为。我知道这个地方到处都是真正的编码员和专家,这就是我伸出手来的原因:)

.login_button的CSS

.login_button {  
    display:inline !important;
    margin-top: 38px !important;
    float: left !important;  
    background:#e73f3a !important;
    color:White !important;
    font-family:roboto !important;
    font-size:22px !important;
    }

你可以在这里看到这个问题:https://netterrain.com - 它是红色的LOG IN按钮。

我非常感谢任何人都可以提供帮助。谢谢:)

1 个答案:

答案 0 :(得分:0)

您的问题是,当您开始滚动时,其值为38px的初始// on scroll, $(window).on('scroll',function(){ $('.login_button').addClass('is-scrolling'); }); 应更改为13px。

滚动时需要在按钮上添加另一个类:

你可以使用javascript实现这一点:

.login_button is .login_button .is-scrolling{

    margin-top: 13px !important;
}

在你的CSS中加上这个:

array[random]=1+array[random];