Question

我不明白为什么不在WordPress的bootstrap下拉菜单中显示所选项目？我的网站：http://nauglyahh.ru/en/blog/。它应该像这样工作：http://www.bootply.com/62811

我的菜单代码：

<?php
        wp_nav_menu( array(
            'menu'              => 'dropdown',
            'theme_location'    => 'menu-6',
            'depth'             => 2,
            'container'         => 'div',
            'container_class'   => 'collapse navbar-collapse',
            'container_id'      => 'bs-example-navbar-collapse-1',
            'menu_class'        => 'nav navbar-nav',
            'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
            'walker'            => new wp_bootstrap_navwalker())
        );
    ?>

我的javascript代码：

jQuery(document).ready(function () {
  jQuery(".dropdown-menu li a").click(function(){
    jQuery(".dropdown-toggle").html(jQuery(this).text()+' <span class="caret"></span>');
  });

  jQuery(".dropdown-toggle").click(function(){
        jQuery('#blog').toggleClass('blogTranslateY');
  });

  jQuery(document).on("click", function(event){
    var dropdown = jQuery(".dropdown-toggle");
    if(dropdown !== event.target && !dropdown.has(event.target).length){
      jQuery('#blog').removeClass('blogTranslateY');
  }
});

})

我的css：

.navbar-header ul {
  padding: 0;
  margin-top: 0;
}
.navbar-header li{
  list-style: none;
  height: 40px;
  line-height: 39px;
  background-color: #eeeeee;
  border-bottom: 1px solid #fff;
  text-align: center;
}
.dropdown-menu {
  display: none;
}
.dropdown-toggle::after {
  content: '';
  background-image: url(img/arrow.png);
  width: 15px;
  background-size: 100%;
  background-repeat: no-repeat;
  height: 9px;
  position: absolute;
  right: 2%;
  top: 50%;
  margin-top: -4px;
  transition-duration: 0.4s;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}

.dropup,
.dropdown {
  position: relative;
}
.navbar-nav {
  padding: 0;
}
.bs-example-navbar-collapse-1 {
  overflow: hidden;
}
.dropdown-menu {
  top: 100%;
  display: block;
  visibility: hidden;
  float: left;
  width: 100%;
  z-index: 1;
  margin-top: 1px;
  font-size: 14px;
  text-align: left;
  list-style: none;
  background-color: #fff;
  transition: all 0.5s ease-in;
  transform: translateY(-200px);
}
.dropdown, a.dropdown-toggle {
  position: relative;
  z-index: 5;
  background-color: #eeeeee;
  border-bottom: 1px solid #fff;
}
.dropdown-menu .divider {
  height: 1px;
  margin: 9px 0;
  overflow: hidden;
  background-color: #e5e5e5;
}
.dropdown-menu > li > a {
  display: block;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color: #333;
  white-space: nowrap;
  line-height: 37px;
}
.dropdown-toggle {
  display: block;
  text-decoration: none;
}
.navbar-header a {
  text-decoration: none;
}
.navbar-header a:hover {
  color: #209dd8;
}
.dropdown.open > .dropdown-toggle::after {
  -webkit-transform:rotate(180deg);
  transform: rotate(180deg);
}
.dropdown.open > .dropdown-menu {
  transform: translateY(0);
  visibility: visible;
}
.blogTranslateY {
  transition-delay: 0s!important;
  margin-top: 0!important;
}

Answer 1

好吧，我发现在你的样式文件中你告诉CSS只有.nav-category .current-menu-item , .current-menu-parent { background-color: #fff!important; }个活动菜单项应该得到样式..这不包括你的下拉菜单..只需转到你的{ {3}}第81行并更改此内容：

.current-menu-item , .current-menu-parent  {
    background-color: #fff!important;
}

到此：

private final WebView mWebView = (WebView) findViewById(R.id.activity_web);

为什么不在WordPress的bootstrap下拉列表中显示所选项？

1 个答案: