當我按下我的靜音按鈕時，文本被突出顯示

我有一個靜音按鈕，可在兩個圖像（一個靜音，一個靜音）之間切換，而按鈕本身按照它的設定進行。但無論出於何種原因，當我多次按下按鈕或太快時，最近的選擇符（它是文本或圖像）會突出顯示，就好像該按鈕是透明圖層，而實際上只是按下背景我的網頁。爲什麼我的靜音按鈕可以做到這一點？我已經多次閱讀我的腳本，但無法解決問題。有什麼我可以包裹我的靜音按鈕，使其行爲更像一個按鈕？當我按下我的靜音按鈕時，文本被突出顯示

這是按鈕

<style> 
.unmute{  
background-image: url(unmute.png); 
position: absolute; 
background-size: cover; 
margin-left: 25px; 
width:153; 
height:96; 
cursor: pointer; 
} 

.mute{ 
background-image: url(mute.png); 
} 
</style> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"</script> 

<audio id="track" autoplay="autoplay" loop="loop"> 
    <source src="poopsyflop.wav"/> 
</audio> 

<div class='unmute' onclick="document.getElementById('track').muted = 
!document.getElementById('track').muted;$(this).toggleClass('mute')"></div> 
<a href="#noscroll" id="mute"></a>

代碼（我拆開腳本jQuery代碼，所以看起來不同（比較雜亂）在我的腳本）有什麼我可以添加/刪除從我的按鈕代碼，使它更像一個按鈕？（如有需要，我會進一步細化）

在此先感謝大家！

-Daniel

來源

2014-10-01 Daniel Thorstensen

可以取消激活與CSS元素用戶選擇：

.unmute, 
.mute 
{ 
    -webkit-user-select: none; 
     -moz-user-select: none; 
     -ms-user-select: none; 
      user-select: none; 
}

瀏覽器保持兼容：3210

編輯：您也可以使用一個真正的按鈕元素和風格它如你所願。

來源

2014-10-01 14:22:49 TheFrozenOne

它工作！非常感謝你！ :) – 2014-10-01 14:26:10

@DanielThorstensen請接受我剛剛做的Doodlebunch – Jean 2014-10-01 14:32:27

的回答。出於某種原因，我不得不等待9分鐘，直到我可以。也許答案需要在x時間內才能被接受 – 2014-10-01 14:36:04

當我按下我的靜音按鈕時，文本被突出顯示

回答

相關問題