PDA

View Full Version : Right Click

Rod
16.05.2001, 06:18
Hi guys! How do you capture right click in IE4 IE5 IE6 NS4 NS6?

I'm creating a menu thats activated by right-click. Please help.

Here is the code:
<html>
<head>
<title>Cross-browser Dynamic HTML Scripts - ContextMenu</title>
<style type="text/css">
body {background:#FFFFFF; color:#000000; font-family:verdana,arial;}
div {font-family:verdana,arial;}
.justify {text-align:justify;}
font {font-family:verdana,arial; color:#000000;}
.text {font-size:11px;}
.link {font-size:11px;}
.h0 {font-weight:bold; font-size:13px;}
.h1 {font-weight:bold; font-size:15px;}
.h2 {font-weight:bold; font-size:18px;}
.h3 {font-weight:bold; font-size:20px;}
#divMenu {position:absolute; z-index:10000; visibility:hidden; width:100px; background-color:#DDDDDD; layer-background-color:#DDDDDD;}
.clMenu {font-family:verdana,arial; font-size:10px; color:#333366; border-width:1px; border-style:solid; border-color:#CCCCCC; padding:4px;}
.clMenuns4 {width:100px; font-family:verdana,arial; font-size:11px; color:#333366; border-width:1px; border-style:solid; border-color:#CCCCCC;}
.menuLinks {text-decoration:none; font-family:verdana,arial; font-size:11px; color:#333366;}
</style>
<script type="text/javascript" language="javascript">
/************************************************** ******************************
Copyright (C) 2001 Rod Morelos
This script is made by and copyrighted to Rod Morelos
wankoi@usa.net || wankoi@hotmail.com
************************************************** ******************************/

// Default browsercheck, added to all scripts!
function checkBrowser()
{
this.ver=navigator.appVersion;
this.dom=document.getElementById?1:0;
this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?1:0;
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ns6=(this.dom && parseInt(this.ver) >= 5)?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.w3c=(this.ie5 || this.ie6 || this.ns6);
this.ie=(this.ie4 || this.ie5 || this.ie6);
this.ns=(this.ns4 || this.ns6);
this.bw=(this.ie4 || this.ie5 || this.ie6 || this.ns4 || this.ns6);
return this
}
var bw=new checkBrowser();

// Makes crossbrowser object
function makeObject(obj)
{
this.css=bw.w3c?document.getElementById(obj).style :bw.ie4?document.all[obj].style:bw.ns4?document.layers[obj]:0;
this.doc=bw.w3c?document.getElementById(obj):bw.ie 4?document.all[obj]:bw.ns4?document.layers[obj]:0;
this.wri=bw.w3c?document.getElementById(obj):bw.ie 4?document.all[obj]:bw.ns4?document.layers[obj].document:0;
this.writeIt=b_writeIt;
this.showIt=b_showIt;
this.hideIt=b_hideIt;
this.moveIt=b_moveIt;
this.oWidth=b_oWidth;
this.oHeight=b_oHeight;
return this
}

// Write the text to the object
function b_writeIt(text)
{
if (bw.ns4)
{
this.wri.open();
this.wri.write(text);
this.wri.close();
}
else if (bw.ie4 || bw.w3c) this.wri.innerHTML=text;
}

// Makes an object's visibiltiy visible
function b_showIt()
{
this.css.visibility='visible';
}

// Makes an object's visibiltiy hidden
function b_hideIt()
{
this.css.visibility='hidden';
}

// Moves the object
function b_moveIt(xL,yT)
{
this.xL=xL;
this.yT=yT;
this.css.left=this.xL;
this.css.top=this.yT;
}

// Get object width
function b_oWidth()
{
if (bw.ns4) if (this.doc.width) return this.doc.width; else return this.doc.clip.width;
if (bw.ie) if (this.css.pixelWidth) return this.css.pixelWidth; else return this.doc.offsetWidth;
if (bw.ns6) if (this.css.width) return parseInt(this.css.width); else return parseInt(this.doc.offsetWidth);
}

// Get object height
function b_oHeight()
{
if (bw.ns4) if (this.doc.height) return this.doc.height; else return this.doc.clip.height;
if (bw.ie) if (this.css.pixelHeight) return this.css.pixelHeight; else return this.doc.offsetHeight;
if (bw.ns6) if (this.css.height) return parseInt(this.css.height); else return parseInt(this.doc.offsetHeight);
}

function showmenu(e)
{
pagewidth = bw.ns?window.innerWidth:document.body.clientWidth;
pageheight = bw.ns?window.innerHeight:document.body.clientHeigh t;
pagescrollx = bw.ns?window.pageXOffset:document.body.scrollLeft;
pagescrolly = bw.ns?window.pageYOffset:document.body.scrollTop;
cursorx = bw.ns?e.pageX:window.event.x;
cursory = bw.ns?e.pageY:window.event.y;
if (cursorx+oMenu.oWidth()>pagewidth) xLeft=cursorx-oMenu.oWidth()+pagescrollx;
else xLeft=cursorx+pagescrollx;
if (cursory+oMenu.oHeight()>pageheight) yTop=cursory-oMenu.oHeight()+pagescrolly;
else yTop=cursory+pagescrolly;
oMenu.moveIt(xLeft,yTop);
oMenu.showIt();
return false
}

function hidemenu()
{
oMenu.hideIt();
}

function init()
{
oMenu = new makeObject('divMenu');
menuLinks = 'Test Link 1 (javascript:;)
Test Link 2 (javascript:;)
Test Link 3 (javascript:;)
Test Link 4 (javascript:;)
Test Link 5 (javascript:;)';
if (!bw.ns4) oMenu.writeIt('<div class="clMenu">'+menuLinks+'</div>');
else oMenu.writeIt('<div class="clMenuns4">'+menuLinks+'</div>');
document.onclick=showmenu
}

onload=init;
</script>
</head>
<body>
<font class="h1">Cross-browser Dynamic HTML Scripts - ContextMenu</font>
<div id="divMenu"></div>
</body>
</html>

Thanks in advance. =)

Rad
[url="http://www.e-syed.net/viewsrc"]viewsrc[/url:l06vqq5io8]
anders
16.05.2001, 06:37
rad,

here's a link to 2 scripts that you might want to look at for referencing the right click...it's ie only though...
http://www.dynamicdrive.com/dynamicindex1/contextmenu.htm
http://www.dynamicdrive.com/dynamicindex1/contextmenu2.htm

tried to solve problem for u, but i just got into even more problems...guess i still have quite a lot to learn on scripting ; )

the main function to capture the right click i believe is soemthing like this:
function click(e) {
if(isie) {
if(document.all) {
if(event.button==2||event.button==3) {
dopopup(event.x-1,event.y-1);
}
}
}
}

if(isie) {
document.oncontextmenu = function() { dopopup(event.x,event.y);return false; }
document.onmousedown = click;

(this code can be found in the script from the link above)

let me know how u do!

anders
http://dzygn.com
Icestorm
16.05.2001, 06:49
Hey Rad, this is simple script that detects right clicks, alerts a message, and returns false, it's pretty much crossbrowser. You could modify it pretty easily to show a layer with a menu instead of popping up an alert. Hope that helps :)

<font color=red><pre id=code><font face=courier size=2 id=code>
<script language=JavaScript type="text/javascript">
<!--
//Put this script in the body section.
//browsercheck...
function checkIt(){
this.op5= (navigator.userAgent.indexOf('Opera')>-1)
this.ie= (document.all && !this.op5)
this.ie4= (document.all && !document.getElementById)
this.ie5= (document.all && document.getElementById && !this.op5)
this.ns4= (document.layers && !document.getElementById)
this.ns6= (!document.all && document.getElementById && !this.op5)
this.mac= (navigator.userAgent.indexOf('Mac')>-1)
this.win= (navigator.userAgent.indexOf('Windows')>-1)
this.ok= (this.ie4 || this.ie5 || this.ns4 || this.ns6 || this.op5)
}
bw= new checkIt()

var message="Function Disabled";
function click(e) {
if (bw.ie && (event.button==2||event.button==3) ) {
alert(message);
return false;
}
else if (bw.ns4 || bw.ns6 && e.which==3) {
alert(message);
return false;
}
}
if (bw.ns4) {document.captureEvents(Event.MOUSEDOWN);}
if (bw.ok && !bw.ns6) {document.onmousedown=click;}
if (bw.ns6) {document.onmouseup=click;}
// -->
</script>
</font id=code></pre id=code></font id=red>

Edited by - icestorm on 05/16/2001 05:58:32
Xanth
16.05.2001, 15:02
you can use document.oncontextmenu to capture the right button in IE it's supposed to work in NS6 as well I believe but like many things it doesn't

function Mike(name, mail) {
*****this.name = "Xanth";
*****this.mail = [url:x9i340s9rh]belgedin@earthlink.net[/url:x9i340s9rh];
*****return this;
}
dayve
16.05.2001, 19:30
that will not work for older browsers though right? I am using a right click capture script similar to the one above at my work site just for fun. some of you may have seen this at DoubleYou.com. I've been meaning to change the ascii art that comes up when you right click but in the meantime check out:

http://www.hafresno.org/home.html

and then right click in the screen...

again, this is only for fun, but it is crossbrowser and covers version 4 on up although I never tested it in gen 4 browsers...

dayve

NIN Discussion: http://www.burningsouls.com/forum
Xanth
16.05.2001, 19:34
Yeah it only works in IE5+ right now but it's fail proof.. i.e. there are alot of little work arounds for you basic stop right-click script the only one for oncontextmenu is viewsource so it works really well for making right-click menus.

function Mike(name, mail) {
*****this.name = "Xanth";
*****this.mail = [url:lppdy4gu13]belgedin@earthlink.net[/url:lppdy4gu13];
*****return this;
}

Edited by - Xanth on 05/16/2001 18:36:08
Icestorm
17.05.2001, 08:44
ecs: check the script I posted, it stops all right-click context menus in browsers 4+ (Mac not tested though :) )