SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Guru
    Join Date
    Sep 2007
    Posts
    971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Linking a context menu (hard)

    I have this code where you right click on a table and it displays a small menu, but when i click view profile in internet explorer it points to the url viewprofile.php?username=then the table i clickedname in firefox it dosnt seem to link with the table name. Also when i right click on a table it displays the table name at the top of the menu it works in both ie and firefox. Can anyone help me my code is:

    context menu
    Code:
    <head>
    <style>
    <!--
    
    .skin0{
    position:absolute;
    width:100px;
    border:2px solid black;
    background-color:menu;
    font-family:arial;
    line-height:20px;
    cursor:default;
    font-size:10px;
    z-index:100;
    visibility:hidden;
    }
    
    .menuitems{
    padding-left:10px;
    padding-right:10px;
    }
    -->
    </style>
    </head>
    
    <body>
    <div id="ie5menu" class="skin0" onMouseover="highlightie5(event)" onMouseout="lowlightie5(event)" onClick="jumptoie5(event)">
    	<div align="center" id="ie5menu_Username"></div><hr>
    	<div class="menuitems" id="ie5menu_privatechat" url="prvchat.php?username=" target="function">Private chat</div>
    	<div class="menuitems" id="ie5menu_ignoreuser" url="ignoreuser.php?username=" target="function">Ignore user</div>
    	<div class="menuitems" id="ie5menu_sendchatmail" url="sendchatmail.php?username=" target="function">Send chatmail</div>
    	<div class="menuitems" id="ie5menu_viewprofile" url="viewprofileshow.php?username=" target="htmlframe">View profile</div>
    	<div class="menuitems" id="ie5menu_kickuser" url="kickuser.php?username=" target="function">Kick user</div>
    </div>
    
    <script language="JavaScript1.2">
    //set this variable to 1 if you wish the URLs of the highlighted menu to be displayed in the status bar
    var display_url = 0;
    var ie5=document.all&&document.getElementById;
    var ns6=document.getElementById&&!document.all;
    if (ie5||ns6)
    	var menuobj=document.getElementById("ie5menu");
    function showmenuie5(e){
    	var firingobj=ie5? event.srcElement : e.target;
    	//Find out how close the mouse is to the corner of the window
    	var rightedge=ie5? document.body.clientWidth-event.clientX : window.innerWidth-e.clientX;
    	var bottomedge=ie5? document.body.clientHeight-event.clientY : window.innerHeight-e.clientY;
    	//if the horizontal distance isn't enough to accomodate the width of the context menu
    	if (rightedge<menuobj.offsetWidth)
    		//move the horizontal position of the menu to the left by it's width
    		menuobj.style.left=ie5? document.body.scrollLeft+event.clientX-menuobj.offsetWidth : window.pageXOffset+e.clientX-menuobj.offsetWidth;
    	else
    		//position the horizontal position of the menu where the mouse was clicked
    		menuobj.style.left=ie5? document.body.scrollLeft+event.clientX : window.pageXOffset+e.clientX;
    	//same concept with the vertical position
    	if (bottomedge<menuobj.offsetHeight)
    		menuobj.style.top=ie5? document.body.scrollTop+event.clientY-menuobj.offsetHeight : window.pageYOffset+e.clientY-menuobj.offsetHeight;
    	else
    		menuobj.style.top=ie5? document.body.scrollTop+event.clientY : window.pageYOffset+e.clientY;
    	//assign the values to the menu DIV
    	var username = firingobj.id;
    	document.getElementById('ie5menu_Username').innerHTML = username;
    	document.getElementById('ie5menu_ignoreuser').url = "ignoreuser.php?username=" + username;
    	document.getElementById('ie5menu_privatechat').url= "prvchat.php?username=" + username;
    	document.getElementById('ie5menu_viewprofile').url= "viewprofileshow.php?username=" + username;
    	document.getElementById('ie5menu_kickuser').url= "kickuser.php?username=" + username;
    	menuobj.style.visibility="visible";
    	return false
    }
    
    function hidemenuie5(e){
    	menuobj.style.visibility="hidden"
    }
    
    function highlightie5(e){
    	var firingobj=ie5? event.srcElement : e.target
    	if (firingobj.className=="menuitems"||ns6&&firingobj.parentNode.className=="menuitems"){
    		if (ns6&&firingobj.parentNode.className=="menuitems") firingobj=firingobj.parentNode //up one node
    		firingobj.style.backgroundColor="highlight"
    		firingobj.style.color="white"
    		if (display_url==1)
    			window.status=event.srcElement.url
    	}
    }
    
    function lowlightie5(e){
    	var firingobj=ie5? event.srcElement : e.target
    	if (firingobj.className=="menuitems"||ns6&&firingobj.parentNode.className=="menuitems"){
    		if (ns6&&firingobj.parentNode.className=="menuitems") firingobj=firingobj.parentNode //up one node
    		firingobj.style.backgroundColor=""
    		firingobj.style.color="black"
    		window.status=''
    	}
    }
    
    function jumptoie5(e){
    	var firingobj=ie5? event.srcElement : e.target
    	if (firingobj.className=="menuitems"||ns6&&firingobj.parentNode.className=="menuitems"){
    		if (ns6&&firingobj.parentNode.className=="menuitems") firingobj=firingobj.parentNode
    		if (firingobj.getAttribute("target"))
    			window.open(firingobj.getAttribute("url"),firingobj.getAttribute("target"))
    		else
    			window.location=firingobj.getAttribute("url")
    	}
    }
    
    if (ie5||ns6){
    	menuobj.style.display=''
    	document.onclick=hidemenuie5
    }
    </script>
    </body>
    Code:
    <td align="center" id="<?= $onlineusersqry[username]; ?>" oncontextmenu="return showmenuie5(event)"><?= $test ?></td></div>
    another problem i have is i cant display an image in the table with the code above, because if i do it dosnt output the table name at all.

    Thanks.
    Animated Chatrooms - www.121chatrooms.net

  2. #2
    SitePoint Guru
    Join Date
    Sep 2007
    Posts
    971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    anybody?
    Animated Chatrooms - www.121chatrooms.net

  3. #3
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,678
    Mentioned
    99 Post(s)
    Tagged
    4 Thread(s)
    Do you have this running on a test page? That will make it a lot easier to figure out some answers.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  4. #4
    SitePoint Guru
    Join Date
    Sep 2007
    Posts
    971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    demo at http://220.245.192.227 click the link then type a username in guest login and selet an avatar then test it from there cheers
    Animated Chatrooms - www.121chatrooms.net

  5. #5
    SitePoint Guru
    Join Date
    Sep 2007
    Posts
    971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i am trying to add a image to code so instead of rightclicking on test i click on the image, but when i insert an image in the code it dosnt display the table name only in plain text how can i insert an image:

    Code:
    <td align="center" id="<?= $onlineusersqry[username]; ?>" oncontextmenu="return showmenuie5(event)">test <img src="images/avatars/1.gif"></td></div>
    Animated Chatrooms - www.121chatrooms.net

  6. #6
    SitePoint Guru
    Join Date
    Sep 2007
    Posts
    971
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    its like it dosnt reconise + username in firefox using links.
    Animated Chatrooms - www.121chatrooms.net


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •