您好 :) 我有点想在这里发帖,但我已经无计可施了。
我正在为公司网站使用 wordpress 和主题 - Cake。
我正在尝试放置一个动态按钮以与粘性包装器 (.menu_wrapper) 中的 wordpress 菜单对齐。无论我做什么 - float 、显示等 - 按钮在滚动时都会轻微跳跃。代码在正确的位置,但我无法将此按钮分配给与 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 - 这是红色的登录按钮。
我真的非常感谢任何人可以提供的帮助。谢谢 :)
最佳答案
您的问题是当您开始滚动时,初始值是 38px 的 margin-top
应该更改为 13px。
滚动时需要给按钮添加另一个类:
您可以使用 javascript 实现此目的:
// on scroll,
$(window).on('scroll',function(){
$('.login_button').addClass('is-scrolling');
});
然后在你的 CSS 中添加:
.login_button is .login_button .is-scrolling{
margin-top: 13px !important;
}
关于html - 粘性菜单中的元素在滚动时被按下,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42318783/