Page Details >>> Right Click Menu.
 
Script Categories













Page Details >>> Right Click Menu.

(Internet Explorer Only) Displays a menu when the visitor right click's on the page. You can easily use style sheets to modify the menu skins, or write your own.



Just right click on the page for the demo

Add the below code to the <body> section of your page:

<style>
<!--
.skin0 { position:absolute;
text-align:left;
width:200px;
border:2px solid black;
background-color:menu;
font-family:Verdana;
line-height:20px;
cursor:default;
visibility:hidden;
}
.skin1 {
cursor:default;
font:menutext;
position:absolute;
text-align:left;
font-family: Arial, Helvetica, sans-serif;
font-size: 10pt;
width:120px;
background-color:menu;
border:1 solid buttonface;
visibility:hidden;
border:2 outset buttonhighlight;
}
.menuitems {
padding-left:15px;
padding-right:10px;
}
-->
</style>

<script language="javascript" type="text/javascript">      
/* Visit http://www.yaldex.com/ for full source code
and get more free JavaScript, CSS and DHTML scripts! */
<!-- Begin
var menuskin = "skin1"; // skin0, or skin1
var display_url = 0; // Show URLs in status bar?
function showmenuie5() {
var rightedge = document.body.clientWidth-event.clientX;
var bottomedge = document.body.clientHeight-event.clientY;
if (rightedge < ie5menu.offsetWidth)
ie5menu.style.left = document.body.scrollLeft + event.clientX - ie5menu.offsetWidth;
else
ie5menu.style.left = document.body.scrollLeft + event.clientX;
if (bottomedge < ie5menu.offsetHeight)
ie5menu.style.top = document.body.scrollTop + event.clientY - ie5menu.offsetHeight;
else
ie5menu.style.top = document.body.scrollTop + event.clientY;
ie5menu.style.visibility = "visible";
return false;
}
function hidemenuie5() {
ie5menu.style.visibility = "hidden";
}
function highlightie5() {
if (event.srcElement.className == "menuitems") {
event.srcElement.style.backgroundColor = "highlight";
event.srcElement.style.color = "white";
if (display_url)
window.status = event.srcElement.url;
   }
}
function lowlightie5() {
if (event.srcElement.className == "menuitems") {
event.srcElement.style.backgroundColor = "";
event.srcElement.style.color = "black";
window.status = "";
   }
}
function jumptoie5() {
if (event.srcElement.className == "menuitems") {
if (event.srcElement.getAttribute("target") != null)
window.open(event.srcElement.url, event.srcElement.getAttribute("target"));
else
window.location = event.srcElement.url;
   }
}
//  End -->
</script>
<div id="ie5menu" class="skin0" onMouseover="highlightie5()" onMouseout="lowlightie5()" onClick="jumptoie5();">

<
div class="menuitems" url="javascript:history.back();">Go Back</div>
<
div class="menuitems" url="http://yaldex.com">Go Home</div>
<
hr>
<
div class="menuitems" url="http://yaldex.com/JSFactory_Pro.htm">JS Forum</div>
<
div class="menuitems" url="http://yaldex.com/JSFactory_Pro.htm">Site FAQs</div>
<
hr>
<
div class="menuitems" url="http://yaldex.com/JSFactory_Pro.htm">Link to Us</div>
<
div class="menuitems" url="http://yaldex.com/JSFactory_Pro.htm">Contact Us</div>
<
/div>
<script language="JavaScript1.2">
if (document.all && window.print) {
ie5menu.className = menuskin;
document.oncontextmenu = showmenuie5;
document.body.onclick = hidemenuie5;
}
</script>

JavaScript Editor Get Advanced
JavaScript and Ajax Editor,
Validator and Debugger!

1st JavaScript Editor.



Code was highlighted by 1st JavaScript Editor (The Best JavaScript Editor!).




©