How to hide the URL when hover over a link?

Question

Would it be possible for when I hover over the image the href won't display the link to the raw video? (bottom left of web browser)?

Also, how can I disable right click so they won't get the video options.

 <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> 

Since no video tags are being used, I'm not to sure about this.

My idea was maybe the href would toggle a javascript function. The function would pretty much do the same thing. store the raw link in a variable.

Answer 1

With CSS only, you can set up a layer on top of the link. Below is an example of using pseudo element :before + some position tricks.

 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> 

With JavaScript, try the following approach.

 <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

Thank you all for your help. I obtained the solution.

href set it to hash:

href="#"

Add an onclick attribute that runs a JS function:

Onclick="video()"

For the function add this:

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

To disable the videos right click menu. All i did was add this to the body tag:

oncontextmenu="return false;"

Luckily for me, I can disable the whole pages right click. Since i have no video tag i can't use it on the video tag.