如何在滚动上限制固定菜单栏的宽度?

时间:2017-02-02 作者:Rainer Brumshagen

我的主菜单栏有透明的背景。为了让菜单始终显示在顶部,我寻找了一个解决方案,得到了下面的2个代码。除了菜单栏的宽度外,此代码工作正常。

卷轴上的固定菜单栏必须缩短到页面大小(最大宽度1200px)。目前,此菜单栏具有屏幕的宽度。

获取固定的半透明菜单栏(仅在滚动时可见!)我使用了这些代码:我修改过的样式中的第一个代码。css(第1199行):

.nav-secondary {
    background-color: rgba(0,0,0,0.5);
    color: #fff;
    font-size: 16px;
    display: none;
    position: fixed;
    width: 100%;
    z-index: 999;
}
修改函数中的第二个代码。php:

//* Reposition the primary navigation
remove_action( \'genesis_after_header\', \'genesis_do_nav\' );
add_action( \'genesis_before_header\', \'genesis_do_nav\' );

//* Enqueue sticky menu script
add_action( \'wp_enqueue_scripts\', \'sp_enqueue_script\' );
function sp_enqueue_script() {
wp_enqueue_script( \'sample-sticky-menu\', get_bloginfo( \'stylesheet_directory\' ) . \'/js/sticky-menu.js\', array( \'jquery\' ), \'1.0.0\' );
}
//* Reposition the secondary navigation menu
remove_action( \'genesis_after_header\', \'genesis_do_subnav\' );
add_action( \'genesis_before\', \'genesis_do_subnav\' );
正如您在css代码中看到的,宽度设置为100%。我试过1200px,但在这里不行。我想有一个响应迅速的解决方案。

我正在使用LifeStyle Pro儿童主题。目前在我的测试现场:http://www.official.jungvital.com

感谢大家对本案的帮助!

你好,雷纳

1 个回复
SO网友:McPace

您有另一个div控制全宽背景。如果你想让宽度看起来更宽,你需要改变它的css。此css将背景从您拥有的全宽div中移除,并将背景置于最大为1200px的包裹div上;

.lifestyle pro蓝色。导航辅助{背景:无;}。包裹{背景色:rgba(0,0,0,0.5);}

相关推荐

如何在WordPress unctions.php中将短代码值传递到Head

我正在尝试为wordpress帖子上的图表创建一个快捷代码。到目前为止,我已经使用了短代码,我可以看到短代码值正在被传递,但我需要知道的是如何将这些值传递到Google图表,以便正确工作。以下是我目前掌握的代码:function chart_shortcode($atts) { $a = shortcode_atts( array( \'value1\' => \'\', \'value2\' => \'\', \'value