Results 1 to 2 of 2

Thread: show div onselect and onclick

  1. #1
    Join Date
    Apr 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Lightbulb show div onselect and onclick

    Can someone modify this script to load by selecting an object and then right-clicking on it?
    on the head:
    Code:
    var SimpleContextMenu = {
     
    	// private attributes
    	_menus : new Array,
    	_attachedElement : null,
    	_menuElement : null,
    	_preventDefault : true,
    	_preventForms : true,
     
     
    	// public method. Sets up whole context menu stuff..
    	setup : function (conf) {
     
    		if ( document.all && document.getElementById && !window.opera ) {
    			SimpleContextMenu.IE = true;
    		}
     
    		if ( !document.all && document.getElementById && !window.opera ) {
    			SimpleContextMenu.FF = true;
    		}
     
    		if ( document.all && document.getElementById && window.opera ) {
    			SimpleContextMenu.OP = true;
    		}
     
    		if ( SimpleContextMenu.IE || SimpleContextMenu.FF ) {
     
    			document.oncontextmenu = SimpleContextMenu._show;
    			document.onclick = SimpleContextMenu._hide;
     
    			if (conf && typeof(conf.preventDefault) != "undefined") {
    				SimpleContextMenu._preventDefault = conf.preventDefault;
    			}
     
    			if (conf && typeof(conf.preventForms) != "undefined") {
    				SimpleContextMenu._preventForms = conf.preventForms;
    			}
     
    		}
     
    	},
     
     
    	// public method. Attaches context menus to specific class names
    	attach : function (classNames, menuId) {
     
    		if (typeof(classNames) == "string") {
    			SimpleContextMenu._menus[classNames] = menuId;
    		}
     
    		if (typeof(classNames) == "object") {
    			for (x = 0; x < classNames.length; x++) {
    				SimpleContextMenu._menus[classNames[x]] = menuId;
    			}
    		}
     
    	},
     
     
    	// private method. Get which context menu to show
    	_getMenuElementId : function (e) {
     
    		if (SimpleContextMenu.IE) {
    			SimpleContextMenu._attachedElement = event.srcElement;
    		} else {
    			SimpleContextMenu._attachedElement = e.target;
    		}
     
    		while(SimpleContextMenu._attachedElement != null) {
    			var className = SimpleContextMenu._attachedElement.className;
     
    			if (typeof(className) != "undefined") {
    				className = className.replace(/^\s+/g, "").replace(/\s+$/g, "")
    				var classArray = className.split(/[ ]+/g);
     
    				for (i = 0; i < classArray.length; i++) {
    					if (SimpleContextMenu._menus[classArray[i]]) {
    						return SimpleContextMenu._menus[classArray[i]];
    					}
    				}
    			}
     
    			if (SimpleContextMenu.IE) {
    				SimpleContextMenu._attachedElement = SimpleContextMenu._attachedElement.parentElement;
    			} else {
    				SimpleContextMenu._attachedElement = SimpleContextMenu._attachedElement.parentNode;
    			}
    		}
     
    		return null;
     
    	},
     
     
    	// private method. Shows context menu
    	_getReturnValue : function (e) {
     
    		var returnValue = true;
    		var evt = SimpleContextMenu.IE ? window.event : e;
     
    		if (evt.button != 1) {
    			if (evt.target) {
    				var el = evt.target;
    			} else if (evt.srcElement) {
    				var el = evt.srcElement;
    			}
     
    			var tname = el.tagName.toLowerCase();
     
    			if ((tname == "input" || tname == "textarea")) {
    				if (!SimpleContextMenu._preventForms) {
    					returnValue = true;
    				} else {
    					returnValue = false;
    				}
    			} else {
    				if (!SimpleContextMenu._preventDefault) {
    					returnValue = true;
    				} else {
    					returnValue = false;
    				}
    			}
    		}
     
    		return returnValue;
     
    	},
     
     
    	// private method. Shows context menu
    	_show : function (e) {
     
    		SimpleContextMenu._hide();
    		var menuElementId = SimpleContextMenu._getMenuElementId(e);
     
    		if (menuElementId) {
    			var m = SimpleContextMenu._getMousePosition(e);
    			var s = SimpleContextMenu._getScrollPosition(e);
     
    			SimpleContextMenu._menuElement = document.getElementById(menuElementId);
    			SimpleContextMenu._menuElement.style.left = m.x + s.x + 'px';
    			SimpleContextMenu._menuElement.style.top = m.y + s.y + 'px';
    			SimpleContextMenu._menuElement.style.display = 'block';
    			return false;
    		}
     
    		return SimpleContextMenu._getReturnValue(e);
     
    	},
     
     
    	// private method. Hides context menu
    	_hide : function () {
     
    		if (SimpleContextMenu._menuElement) {
    			SimpleContextMenu._menuElement.style.display = 'none';
    		}
     
    	},
     
     
    	// private method. Returns mouse position
    	_getMousePosition : function (e) {
     
    		e = e ? e : window.event;
    		var position = {
    			'x' : e.clientX,
    			'y' : e.clientY
    		}
     
    		return position;
     
    	},
     
     
    	// private method. Get document scroll position
    	_getScrollPosition : function () {
     
    		var x = 0;
    		var y = 0;
     
    		if( typeof( window.pageYOffset ) == 'number' ) {
    			x = window.pageXOffset;
    			y = window.pageYOffset;
    		} else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    			x = document.documentElement.scrollLeft;
    			y = document.documentElement.scrollTop;
    		} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    			x = document.body.scrollLeft;
    			y = document.body.scrollTop;
    		}
     
    		var position = {
    			'x' : x,
    			'y' : y
    		}
    
    		return position;
    
    	}
     
    }
    Code:
    SimpleContextMenu.setup({'preventDefault':true, 'preventForms':false});
    SimpleContextMenu.attach('', 'contextmenu');
    on the body:
    Code:
    <div id=contextmenu class=SimpleContextMenu>
    <li><a onClick="window.history.go(-1);"><img src=img/back.png align=top> &nbsp;Back</a></li>
    <li><a onClick="window.history.go(1);"><img src=img/forward.png align=top> &nbsp;Forward</a></li>
    <li><a onClick="document.location.reload()"><img src=img/reload.png align=top> &nbsp;Reload</a></li>
    </div>
    This is the second javascript to show (there is a first) then they must not be similar!

  2. #2
    Join Date
    Apr 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation

    Please help me!

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
  •