色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

點擊導航欄鏈接時意外選擇的文本(Android上的chrome mobile)

張吉惟2年前8瀏覽0評論

當我在我的html頁面上選擇文本時,隨后點擊導航條鏈接會反復選擇和取消選擇文本。這是在裝有最新版本android的三星設備chro me(最新版本)上測試的。我附上一個片段來理解這個問題。請在Android設備上運行該片段來驗證問題。

function goTo(){}

nav {
    padding: 10px 20px 15px 0;
    height: calc(45px + 1vw);
    justify-content: center;
    user-select: none; /* rende testo non selezionabile */
    -moz-user-select: none; /* firefox */
    -webkit-user-select: none; /* Chrome, Opera and Safari*/
    -ms-user-select: none; /* IE, ms-edge */
    flex-direction: column;
    align-items: end;
    background-color: #040405;
    position: relative;
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    transition: .3s ease;
    z-index: 1;
}

nav.light {
    background-color: #EDE8DD;
}

nav ul li {
    display: inline-block; /* allinea orizzontalmente i link della navbar */
    padding-left: calc(15px + 1vw); /* padding a sinistra di ogni link della navbar */
}

nav a {
    color: #A2A2A4 !important;
    text-decoration: none; /* elimina elementi decorativi dei link presenti di default */
    position: relative;
    transition: all .3s ease; /* transizione cambio colore onHover e colore sfondo */
    cursor: pointer;
    font-size: calc(10px + 0.8vw);
    background-color: transparent;
    -webkit-tap-highlight-color: transparent; /* evita effetto pressione link */
}

nav.light a {
    color: #575758 !important;
}

nav a.active {
    color: #FEFEFE !important;
}

nav.light a.active {
    color: #040405 !important;
}

nav a.active::before { /* rende visibile striscia sotto link attivo */
    content: "";
    position: absolute;
    background-color: #d52d08;
    border-radius: 20px;
    height: 3px;
    width: 100%;
    left: 0;
    bottom: -5px;
    transition: .3s ease;
    pointer-events: none; /* evita bug che rende la striscia cliccabile */
}

@media (hover : hover) {
    nav a:hover::after { /* rende visibile striscia sotto link quando hover (dispositivi che lo permettono) */
        content: "";
        position: absolute;
        background-color: #d52d08;
        border-radius: 20px;
        height: 3px;
        width: 100%;
        left: 0;
        bottom: -5px;
        transition: .3s ease;
        pointer-events: none; /* evita bug che rende la striscia cliccabile */
    }
}

<!DOCTYPE html>
<html lang="it">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="stylesheet" href="style.css">
    <title>Esame di stato</title>
</head>
<body>
    <nav id="menu">
        <ul>
            <li><a id="home" class="active" onclick="goTo(id)">Home</a></li><!--
            --><li><a id="educazione_civica" onclick="goTo(id)">Educazione civica</a></li><!--
            --><li><a id="pcto" onclick="goTo(id)">Pcto</a><!--
            --><li><a id="materie"  onclick="goTo(id)">Materie</a>
            </li>
        </ul>
    </nav>
  <p style="margin-top: 100px;">Select this text and then if you click on the navbar links the text will be selected and deselected by itself</p>
  <p>This only happens on android</p>
</body>
</html>