Question

打开侧面导航菜单时，我试图调暗页面。当我打开它时，我应用rgba背景颜色，但是这不适用于文本颜色，即使我设置了更高的z-index。也不适用于输入字段，但为此我将输入背景设置为无，这是有效的。但我真正想要的是在打开菜单时调暗页面，而不必弄乱输入颜色并使文本变暗。

这是我的代码：

HTML

            <input style="background:none"
                id="input_01"
                class="datepicker"
                name="date"
                type="text"

                value=""
                data-valuee="">

           <div class="letter" style="background-image:url(titlebkg.jpg); vertical-align:middle; text-align:        center; color:white; font-size:3em; z-index:-1">title</div>

jquery的

$( '.toggle' ).on( 'touchstart click', function(e) {
  e.preventDefault();

  var $body = $( 'body' ),
      $page = $( '#page' ),
      $menu = $( '#menu' ),


  $body.addClass( 'animating' );


  if ( $body.hasClass( 'menu-visible' ) ) {
   $body.addClass( 'left' );
   $('#pageContainer').css({'background-color':'none'});
  } else {
   $body.addClass( 'right' );
   $('#pageContainer').css({'background-color':'rgba(0,0,0,0.2)'});
  }

Answer 1

尝试在内容上使用绝对容器。

free()

现在添加以下css

NULL

如果仍未达到预期效果，请尝试在切换时更改整个内容'（输入'）<div class="main-container"> <div class="diming-container"> </div>  </div>。

在开放式菜单上使用rgba页面调暗而不是暗淡的文本颜色

1 个答案: