<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<HTML>
<HEAD>
<Title></Title>
<META http-equiv=Content-Type content="text/html; charset=shift_jis">
<style type="text/css">
#DivMenu
<HTML>
<HEAD>
<Title></Title>
<META http-equiv=Content-Type content="text/html; charset=shift_jis">
<style type="text/css">
</style>
<Script>
function func(){
document.onclick = function(){
var ll = [];
var x = event.clientX;
var y = event.clientY;
ll.push('getWindowWidth() : '+getWindowWidth())
ll.push('getWindowHeight(): '+getWindowHeight())
ll.push('event.screenX : '+event.clientX)
ll.push('event.screenY : '+event.clientY)
var menu = document.getElementById('DivMenu');
var dx = menu.offsetWidth;
var dy = menu.offsetHeight;
ll.push('menu.width : '+dx)
ll.push('menu.height : '+dy)
if( getWindowWidth ()<x+dx ){ x = x-dx }
if( getWindowHeight()<y+dy ){ y = y-dy }
menu.style.left = x;
menu.style.top = y;
new OpManu().Set([
{ Text: 'Text1', Action: function(){alert('Action1')} }
,{ Text: 'Text2', Action: function(){alert('Action2')} }
,{ Text: 'Text3', Action: function(){alert('Action3')} }
,{ Text: 'Text4', Action: function(){alert('Action4')} }
]);
log.innerHTML = ll.join('<Br />');
}
}
function OpManu(){
function OpManu(){
this.menu = document.getElementById('DivMenu');
function Set(elements){
for( var i=0; i<elements.length; i++ ){
var e = elements[i];
var a = document.createElement('a');
a.onclick = e.Action
this.menu.appendChild(a);
}
//this.menu.innerHTML = html;
}
OpManu.prototype.Set = Set;
}
}
function getWindowWidth(){
var nss = [ 'window.innerWidth' ,'document.documentElement.clientWidth' ,'document.body.clientWidth' ] return getUsableValue( nss );
}
function getWindowHeight(){
function getWindowHeight(){
var nss = [ 'window.innerHeight' ,'document.documentElement.clientHeight' ,'document.body.clientHeight' ] return getUsableValue( nss );
}
function getUsableValue( ValueNames ){
var vns = ValueNames;
for( var i=0; i<vns.length; i++ ){
if( IsGivenNs(vns[i]) ){
return eval(vns[i]);
}
}
return null;
}
function IsGiven(o){
return typeof(o)!='undefined' && o!=null;
}
function IsGivenNs(Ns){
function IsGivenNs(Ns){
var nn = Ns.split('.');
var o = eval( nn.shift() );
if( !IsGiven(o) ){ return false; }
for( var i=0; i<nn.length; i++ ){
o = o[nn[i]];
if( !IsGiven(o) ){ return false; }
}
return true;
}
</Script>
</HEAD>
<Body onload="func()">
<div id="ddd">ddd</div>
<div id="log">ddd</div>
</Script>
</HEAD>
<Body onload="func()">
<div id="ddd">ddd</div>
<div id="log">ddd</div>
<div id="DivMenu">
<div ><a href="" onClick="status='DivMenu1'">DivMenu1</a></div>
<div ><a href="" onClick="status='DivMenu2'">DivMenu2</a></div>
<div ><a href="" onClick="status='DivMenu3'">DivMenu3</a></div>
</div>
<div ><a href="" onClick="status='DivMenu1'">DivMenu1</a></div>
<div ><a href="" onClick="status='DivMenu2'">DivMenu2</a></div>
<div ><a href="" onClick="status='DivMenu3'">DivMenu3</a></div>
</div>
</Body>
</HTML>
</HTML>
