將鼠標懸停在鏈接上時如何隱藏URL？

Question

當我將鼠標懸停在圖像上時，href將不會顯示原始視頻的鏈接嗎？ （網絡瀏覽器的左下方）？

另外，如何禁用右鍵單擊，使他們無法獲得視頻選項。

 <article> <a class="thumbnail" href="http://vjs.zencdn.net/v/oceans.mp4"> <img src="http://i.livescience.com/images/i/000/026/853/iFF/ocean-waves-beach.jpg?1336055104" alt="" /> </a> </article> 

由於未使用任何視頻標簽，因此我不確定。

我的想法是href可以切換javascript函數。 該功能幾乎可以做同樣的事情。 將原始鏈接存儲在變量中。

Answer 1

僅使用CSS，您可以在鏈接頂部設置一個圖層。 以下是使用偽元素:before +一些position技巧的示例。

 article { position: relative; display: block; } article:before { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 1; } 

 <article> <a class="thumbnail" href="http://vjs.zencdn.net/v/oceans.mp4"> <img src="http://i.livescience.com/images/i/000/026/853/iFF/ocean-waves-beach.jpg?1336055104" alt="" /> </a> </article> 

使用JavaScript，請嘗試以下方法。

 <article> <a class="thumbnail" href="javascript:void(0)" onclick="javascript:location.href='http://vjs.zencdn.net/v/oceans.mp4'"> <img src="http://i.livescience.com/images/i/000/026/853/iFF/ocean-waves-beach.jpg?1336055104" alt="" /> </a> </article> 

Answer 2

您可以通過在視頻中添加oncontextmenu="return false"來禁用右鍵單擊。

 <video controls="" autoplay="" name="media" oncontextmenu="return false"><source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4" oncontextmenu="return false"></video> 

Answer 3

謝謝大家的幫助。 我得到了解決方案。

href設置為哈希：

href="#"

添加一個運行JS函數的onclick屬性：

Onclick="video()"

對於函數，添加以下內容：

Function video() {
   window.location.href ='VIDEO LINK HERE';
}

要禁用視頻，請右鍵單擊菜單。 我所做的就是將其添加到body標簽：

oncontextmenu="return false;"

對我來說幸運的是，我可以右鍵單擊禁用整個頁面。 由於我沒有視頻標簽，因此無法在視頻標簽上使用它。