单击菜单锚点使背景菜单闪烁?

时间:2018-02-19 11:05:26

标签: html css

CSS:

#header {
    position:fixed;
    display:block;
    width:100%;
    top:0;
    left:0;
    padding-left:0vmax;
    padding-right:5vmax;
    z-index:99999;
    height:8vmax;
    max-height:8vmax;
     transition: .3s linear;
    box-sizing:border-box;
      background-color: rgba(243,243,243,1.00);
        }


#menuwrapper {
    display:block;
    float:right;
    width:80vmax;
    margin:0;
    height:8vmax;
    max-height:8vmax;
    overflow:hidden;
    box-sizing:border-box;
    position:relative;  
}


#menu {position:absolute;height:100%;width:100%;display:table;padding: 2.5vmax; word-wrap:break-word;}
#menu ul {word-spacing:2vmax;font-size:1.5vmax;padding:0;padding-bottom:0vmax;margin: 0 1vmax;}
#menu li {display:inline-block;padding: 1vmax;}
.rechts {display: table-cell;width: 1px;vertical-align: middle;white-space: nowrap;}
#menu ul li a {height:8vmax;text-decoration:none;color:grey;transition: color .45s ease-in-out;margin-right:7.5vmax;}
#menu ul li a:hover {color:#3f92c3;}

HTML:

<div id="header">
<p id="headertitle">Portfolio</p>
<img id="logo" src="images/logo.png">

<div id="menuwrapper">

<div id="menu">
  <ul class="pad">
    </ul>
<ul class="rechts">
<li><a class="a1" id="page1" href="#">Portfolio</a></li>
<li><a class="a1" id="page2" href="#">Services</a></li>
<li><a class="a1" id="page3" href="#">Contact</a></li>
</ul>
</div>
</div>
 <ul id="menutaal">
  <li>
    <input class="menuinput" id="check01" type="checkbox" name="menu"/>
    <label class="menulabel"for="check01"><img id="dutch" src="images/dutch.png"></label>
    <ul class="submenu">
      <li><a href="javascript:;" onclick="messageOn()"><img id="english" src="images/english.png"></a></li>
      <li><a href="javascript:;" onclick="messageOn1()"><img id="spanish" src="images/spanish.png"></a></li>
    </ul>
  </li>
    </ul>
</div>

有人知道当我点击我的锚链接时标题背景会轻微闪烁吗?

我尝试了一些事情,但没有解决它。网上有一些关于这个问题的网页,但没有一个有明确答案的网页(对我来说)。

感谢您的帮助。

0 个答案:

没有答案