Today, let’s record the right mouse button of JS and first decompose its implementation principle:
1. Block the right-click default event; (I thought the one I modified was the default event)
2. Hiding from an ul; (I once thought that this is worthy of div, sweat)
3. Response to the right click of the mouse and display the hidden ul;
4. After the mouse is clicked again, the ul is hidden again
From this point of view, is it much easier to do? First, put the code:
html part
<ul id="testRight"> <li><a href="#">Start</a></li> <li><a href="#">Pause</a></li> <li><a href="#">Worship</a></li> </ul>
JavaScript part:
window.onload=function(){ var forRight=document.getElementById("testRight");//Get the object, now I am too familiar with forRight.style.display="none"; var title=forRight.getElementsByTagName("li"); for(var i=0;i<title.length;i++){ title[i].onmouseover=function(){ this.classname="active";//In fact, we can also call other events here}; title[i].onmouseout=function(){//This is also two events of the mouse, this.classname=""; }; } document.oncontextmenu=function(event){//This is the key point of implementation var event=event||window.event;//This is not a problem forRight.style.display="block"; forRight.style.left=event.clientX+"px"; forRight.style.top=event.clientY+"px";//The mouse coordinates return false;//The return false here is to block the default event}; document.onclick=function(){//It is to imitate more vividly forRight.style.display="none"; }; };Let’s first look at the most critical part of today’s record: if the document.oncontextmenu event returns false, it is to block the default event. If we don’t write anything else, we only write return in this event, as if it’s the following
document.oncontextmenu=function(){ return false; }In this way, no response will appear if you right-click it. Then come back and look at the entire event application. It seems that except for this event, the rest are more familiar events, but this kind of integration of events is always lacking. The key is to think about creativity. But no matter where there are too many, let’s do it first, but I want to read three thousand poems carefully, and I don’t want to write them and just ask. Horse stance, horse stance, horse stance...