JavaScript - How To Make This Menu At Right Position

Hi

I found a website that has an awesome link highlighter thing, but I can't quite understand how they did it. I'm 99% sure its javascript, but I could be wrong. Here is the website: http://www.sosfactory.com/web-design/amazium/
The part I want to emulate is the links in the top right. When you mouse over it the highlight bounces to the link you hover over. I tried looking at the code and here is what it says:

Code:

<!--/header -->
<div id="header">
    	<h1><a href="index.html">AMAZIUM: IT and Management Consulting</a></h1>
        <div id="lava">
          <ul>

            <li class="selected"><a href="#">About</a></li>
            <li><a href="#">Blog</a></li>
            <li><a href="#">Services</a></li>
            <li><a href="#">Consulting</a></li>
            <li><a href="#">Contact</a></li>		
          </ul>
          <div id="box"><div class="head"></div></div>

      </div>  
</div>

I found the CSS file it is referencing, and I believe the LAVA part has something to do with the effect. Here it is:

Code:

/*=== Header ===*/

#header {
	background: #e0d6c8 url(../images/body-bg.gif) repeat-y center ;
	height: 125px;
	margin: 0 auto;
	width: 963px;
	}
		
	#header h1 a {
		background: url(../images/header-logo.png) no-repeat top left;
		display: block;
		width: 343px;
		height: 125px;
		text-indent: -9999px;
		float: left;
		cursor: pointer;
		}

#lava {
	position:relative;
	text-align:center;
	width:450px;
	height:35px;
	float: right;
	margin: 65px 19px 0 0;
	font-weight: bold;
	}
	
	#lava ul {
		margin:0;
		padding:0;
		list-style:none;
		display:inline;
		position:absolute;
		top:1px;
		z-index:100;
		right: 0px;
		}
	
		#lava li {
			margin:0 15px; 
			float:left;
			}
		
			#lava a, #lava a:visited {
				color: #464646;
				text-decoration: none;
				display: block;
				font-size: 15px;
				}
			
			#lava a:hover {color: #fff;}

	#lava #box {
		position:absolute; 
		left:0; 
		top:0; 
		z-index:50; 
		background:url(../images/tail.gif) no-repeat right center; 
		height:20px;
		padding-right:8px;
		margin:1px 0 0 -10px;
		}
		
	#lava #box .head {
		background:url(../images/head.gif) no-repeat 0 0;
		height:20px;
		padding-left:10px;
		}

Anyone have any ideas about how to do this? Here is a link to the css file:
http://www.sosfactory.com/web-design...css/styles.css

Also, there is a folder called js that has a few scripts but I'm not sure what they do. Here's the link:
http://www.sosfactory.com/web-design/amazium/js/


Any help is greatly appreciated!

Hello!

I have a code that shows a very fancy linkable menu. But the problem is that the dropdown menu, isn't linkable. I have tried in all possible way, but when the class="makemefancy" is in the code. The linkable function will not be possible.

Code:

	
<form method="post" action="">
<select name="fancySelect" class="makeMeFancy">

<option value="0" selected="selected" data-skip="1">Fastlinks</option>
<option value="1" data-icon="img/img.png" data-html-text="Facebook&lt;i&gt;Text&lt;/i&gt;">Facebook</option>
        	<option value="2" data-icon="img/yee.png" data-html-text="Twitter&lt;i&gt;Text&lt;/i&gt;">Twitter</option>
            	<option value="3" data-icon="img/aa.png" data-html-text="Live&lt;i&gt;Text&lt;/i&gt;">Live</option>
           	<option value="4" data-icon="img/h.png" data-html-text="Text&lt;i&gt;Text&lt;/i&gt;">Text</option>
        	</select>

</form>

Thankful for help! I want when you click on the option u will get linked to another page.

Hello Folks,

I installed a template on the following site and did not actually write the javascript dropdown menu seen at the top of http://sthomaslc.com/

The problem is that if parent list items Ministries and Parish Leadership have enough children, they expand out right off of the screen of low resolution setups.

I am totally new to javascipt programming so excuse my ignorance when I ask how to make the children items to expand out left instead of right if it's detected that the menu has hit the right side of the browser window.

Best Regards

David

Hello
I have several issues with my multilevel drop down menu
The First issue is : the page has 2 iframes (one has the horizontal multilevel drop down menu on the top) the below iframe has my site address
Now, when i hover over the menu it does not open or expand but when i open just the menu without any iframes it does
This clearly means that the menu is not coming out of the iframe
Please help me bring it on top of everything of the page
Note: i have placed the menu in one iframe and a page opens below it in another iframe.


The Second issue is : I want the navigation bar that is the multilevel drop down menu to be editable
Which means i have a blog and a forum on my site but my visitor wants that the blog should not appear there and another link to play games should

be there and hence he/she can edit it
And please also try to make it work on cookies so that the user info and preferences are saved in cookies and whenever he/she comes back they

see the page their way.

For you: I would like to tell you that IdeaLab has launched a Twitter Advertising, Widget and Search platform and the first 1000 people are getting $100
go to tweetup.com

Please help me, it will be really appreciable. Thank you very much in advance!

I'm new to javascript and am not sure why this works in firefox and not chrome.
I am trying to create a script that keeps an object fixed horizontally while bing positioned absolute vertically.

if I replace the toPP variable in document.getElementById('fire').style.top = toPP; with say '50px' it will move the element down 50 pxs, but how I have it currently it doesn't do anything in chrome

Code:

<script type="text/javascript" >
	
	
window.onscroll = function() 
{
	if( window.XMLHttpRequest ) { 
		
			
			var x = 0 -document.documentElement.scrollTop;
			var toP = String(x);
			var toPP = toP + "px";
			
			document.getElementById('fire').style.position = 'fixed'; 
			document.getElementById('fire').style.top = toPP;
				
	}
}
	</script>

I need to convert a position:fixed element to position:absolute when the user resize their browser window below 1000px.

Right now it does nothing. The element always keeps the fixed positioning even after resizing the window.

Here's what I have right now:

Code:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<base href="http://www.area51entertainment.co/" />
<title>Emoto <?php echo "$section"; ?></title>
<meta charset="UTF-8" /> 
<meta name="verify-v1" content="" />
<meta name="keywords" content=""  />
<meta name="description" content="" />
<meta name="author" content="Andrew McCarrick" />
<meta name="robots" content="index, follow" />
<style type="text/css">
body,html {
background: #FFFFFF; /* Old browsers */
color: #000000; 
font-family: Verdana; 
margin-right:auto;
margin-left:auto;
max-width:1000px;
padding: 0px;
margin-top: 0px;
margin-bottom: 0px;
}
</style>
<link rel="stylesheet" href="emoto/style.css" media="screen" />
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico" />
<link rel="apple-touch-icon" href="http://www.area51entertainment.co/TouchIcon.png" />
<link rel="apple-touch-icon-precomposed" href="http://www.area51entertainment.co/TouchIcon.png" /> 
<link rel="image_src" href="./logo.png" /> 
<script language="javascript" src="emoto/float.js"></script>

</head>
<body>
<div class="wrapper">
<div id="header_float">
<div class="header_wrapper">
<div class="logo">
Picture
</div>
<div class="links">
Home | Settings | Notifications | Requests | Messages | Search Bar
</div>
<div class="links_right">
Profile Link/Sign-Out 
</div>
</div>
</div>
<div class="content_wrapper">
Test2Test2 Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 
Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 
Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 
Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 T
est2Test2Test2 Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 Test2Test2Test2 Test2
</div>
</div>
</body>
</html>

style.css
Code:

a:link {color: #FFFFFF; text-decoration: none;}
a:visited {color: #FFFFFF; text-decoration: none;}
a:active {color: #FFFFFF; text-decoration: none;}
a:hover {color: #3399FF; text-decoration: none;}

.wrapper{
min-height: 2000px;
min-width: 1000px;
}

#header_float{
width: 100%;
min-width: 1000px;
height: 35px;
left:0;
right:0;
top:0;
position: fixed;
background: #49963A;
z-index: 1000;
}

.header_wrapper{
width: 1000px;
height: 35px;
margin-right:auto;
margin-left:auto;
padding: 0px;
margin-top: 0px;
margin-bottom: 0px;
color: #FFFFFF;
}

.logo{
float: left;
width: 150px;
height: 25px;
font-size: 26px;
position: relative;
top: -1px;
left: 8px;
}

.links{
float: left;
width: 670px;
height: 25px;
position: relative;
top: 7px;
}

.links_right{
float: right;
width: 180px;
height: 25px;
position: relative;
top: 7px;
}

.content_wrapper{
position: relative;
top: 35px;
width: 995px;
min-height: 450px;
}

img{
border: 0px;
}

float.js
Code:

if (screen.availWidth<=999)
document.getElementById('header_float').style.position = 'absolute';
else
document.getElementById('header_float').style.position = 'fixed';

Hi Exprts,

I am using a (anylink)javascript menu from dynamic drive. Basically I am having a design issue but posting the problem here because I think this can be fixed through JS.

Please download the attached files. You will see the menu & the sub menu on mouse over. Problem is that.... when the submenu appears & I take my mouse to the sub menu, the parent item hover style disappears. I mean, it doesn't look active. I just want the parent item active when users moves his/her mouse to sub menu. Thats all.

Please suggest me any solutions for this. Thank you in advance.

Hi all, this is my first post so forgive me for any errors but i'll try and give all the information i can. i use Xara Designer Pro and i have used a 3rd party software to create a html menu however i have a html loading screen on my site and the menu always appears on top of the screen and while the screen is loading, this is the only thing that appears on top everything else is fine, i have put this to the people on the xara forums and the opinion is that its probably the JS file that the menu is using that is telling it to appear on top. i was wondering what i should look for to determin this problem or if someone could take a look at it for me? i'll upload the JS here and see if anyone can help. my site is at www.pcevo.co.uk however you need to CTRL + F5 to refresh wihtout the cache to see the loading screen if you are on a fast connection.

I'm creating a menu using html, css and a javascript, I found a tutorial to follow online. What I am trying to achieve is when the mouse hovers over the menu items, each item will have a different colour background. the problem is that i can do this but it only works with one colour and not different colours.

this is the html:

Code:

<ul>
<li><a href="1.php">Things</a></li>
<li><a href="2.php">Animals</a>
  <ul>
    <li><a href="2-1.php">Cani</a>
        <ul>
          <li><a href="2-1-1.php">Domestic dogs</a></li>
          <li><a href="2-1-2.php">Wolves</a></li>
        </ul>
    </li>
    <li><a href="2-2.php">Felidae</a>
        <ul>
          <li><a href="2-2-1.php">Domestic cats</a></li>
          <li><a href="2-2-2.php">Wild cats</a></li>
        </ul>
    </li>
  </ul>
</li>
<li><a href="3.php">Humans</a></li>
</ul>

the css is as follows:

Code:

div#s1 {
width: 200px;          /* menu width */
}

div#s1 ul {
background-color: #036;
list-style-type: none; /* get rid of the bullets */
padding:0;             /* no padding */
margin:0;              /* no margin for IE either */
}

div#s1 ul li {
margin: 0;
padding: 0;
background-color: #036;
display:block;
border-top: 1px solid white; /* lines */
}

div#s1 ul li a {
display: block;         /* lines extend to right, make area clickable */
color: white;
background-color: #036;
padding: 3px 3px 3px 23px;
margin:0;
text-decoration: none;
height:15px;           /* hint for IE, alternatively remove whitespace from HTML */
}

div#s1 ul ul li a {
margin-left: 20px;     /* indent level 1 */
}

div#s1 ul ul ul li a {
margin-left: 40px;     /* indent level 2 */
}

div#s1 ul ul ul ul li a {
margin-left: 60px;     /* indent level 3 */
}

div#s1 li ul, div#s1 li.open li.closed ul {
display: none;         /* collapse */
}

div#s1 li.open ul {
display: block;        /* expand */
}

div#s1 ul li.open a {
background-image: url(bullet_open.gif);
background-repeat: no-repeat;
}

div#s1 ul li.closed a {
background-image: url(bullet_closed.gif);
background-repeat: no-repeat;
}

div#s1 ul li.leaf a {
background-image: url(bullet_leaf.gif);
background-repeat: no-repeat;
}

div#s1 li.active a {
background-position: 0px -20px;
color: red;            /* highlight text */
}

div#s1 li.active li a {
background-position: 0px 0px;
color: white;          /* fix lower levels */
}

div#s1 ul li a:hover {
color: red;
background-color: #06C; /* rollover effect */
}

and finally the javascript:

Code:

var menu_active_class = "active";
var menu_leaf_class = "leaf";
var menu_open_class = "open";
var menu_closed_class = "closed";

//the default page that is displayed if URL ends in /
var menu_default_page = "index.php";
var menu_url;

//main function
//menu_id : id of the element containing the navigation
function menu_main(menu_id) {
 var url = location.href;
 if (url.lastIndexOf("/") == (url.length-1)) {
   url = url+menu_default_page;
 }
 if (url.lastIndexOf("?") >= 0) {
   url = url.substring(0, url.lastIndexOf("?"));
 }
 if (url.lastIndexOf("#") >= 0) {
   url = url.substring(0, url.lastIndexOf("#"));
 }
 menu_url = url;

 var main = document.getElementById(menu_id);
 if (!main) alert("No element with id '"+ menu_id +"' found");
 menu_traverse(main);
 }

 /* Walks down the subtree and on the way back
 sets properties.
 returns bit set
         1: set = element is a node, unset = element is a leaf
         2: set = element contains the active node
         4: set = element is the active A node
*/
function menu_traverse(element) {
var props  = 0;

// walk down
for (var i=0; i<element.childNodes.length; i++) {
  var child = element.childNodes[i];
  props |= menu_traverse(child); // aggregate bits
}

// on the way back now
switch (element.tagName) {
  case "UL":
    props |= 1;
    break;

  case "LI":
    var c1 = (props & 1) ? 
               ((props & (2|4)) ? menu_open_class : menu_closed_class)
             : menu_leaf_class; 
    element.className = element.className ? element.className+" "+c1 : c1;
    if (props & 4) {
      if (!(props & 2)) element.className += " "+menu_active_class;
      props |= 2;
      props &= 1 | 2; // reset bit 4
    }
    break;

  case "A":
    if (props & 2) break; // once is enough
    var href = element.getAttribute("href");
    if (menu_isSameUrl(menu_url, href)) props |= 4;
    break;
  }

  return props;
}

//matches two URIs when href is the last part of url
//.. and . are correctly resolved
function menu_isSameUrl(url, href) {
var a = url.split(/[?\/]/i);
var b = href.split(/[?\/]/i);
var i = a.length - 1;
var j = b.length - 1;
while ((i >= 0) && (j >= 0)) {
  if (b[j] == "..") { j-=2; continue; }
  if (a[i] == "..") { i-=2; continue; }
  if ((b[j] == ".") || (b[j] == "")) { j--; continue; }
  if ((a[i] == ".") || (a[i] == "")) { i--; continue; }
  if (! (a[i] == b[j])) return false;
  i--;
  j--;
 }
 return true;
}

New to this forum but hope this will explain my problem, any help is much appreciated!

thanks!!

Jesper

I am having trouble with a sub-menu of the 1st item only and can not seem to figure it out. All the others are fine. Any help is appreciated. Here is the code:

var NoOffFirstLineMenus=7; // Number of first level items
var LowBgColor='white'; // Background color when mouse is not over
var LowSubBgColor='white'; // Background color when mouse is not over on subs
var HighBgColor='black'; // Background color when mouse is over
var HighSubBgColor='black'; // Background color when mouse is over on subs
var FontLowColor='black'; // Font color when mouse is not over
var FontSubLowColor='black'; // Font color subs when mouse is not over
var FontHighColor='white'; // Font color when mouse is over
var FontSubHighColor='white'; // Font color subs when mouse is over
var BorderColor='black'; // Border color
var BorderSubColor='black'; // Border color for subs
var BorderWidth=1; // Border width
var BorderBtwnElmnts=1; // Border between elements 1 or 0
var FontFamily="arial,comic sans ms,technical" // Font family menu items
var FontSize=9; // Font size menu items
var FontBold=1; // Bold menu items 1 or 0
var FontItalic=0; // Italic menu items 1 or 0
var MenuTextCentered='center'; // Item text position 'left', 'center' or 'right'
var MenuCentered='center'; // Menu horizontal position 'left', 'center' or 'right'
var MenuVerticalCentered='top'; // Menu vertical position 'top', 'middle','bottom' or static
var ChildOverlap=.2; // horizontal overlap child/ parent
var ChildVerticalOverlap=.2; // vertical overlap child/ parent
var StartTop=05; // Menu offset x coordinate
var StartLeft=05; // Menu offset y coordinate
var VerCorrect=0; // Multiple frames y correction
var HorCorrect=0; // Multiple frames x correction
var LeftPaddng=3; // Left padding
var TopPaddng=2; // Top padding
var FirstLineHorizontal=1; // SET TO 1 FOR HORIZONTAL MENU, 0 FOR VERTICAL
var MenuFramesVertical=1; // Frames in cols or rows 1 or 0
var DissapearDelay=1000; // delay before menu folds in
var TakeOverBgColor=1; // Menu frame takes over background color subitem frame
var FirstLineFrame='navig'; // Frame where first level appears
var SecLineFrame='space'; // Frame where sub levels appear
var DocTargetFrame='space'; // Frame where target documents appear
var TargetLoc=''; // span id for relative positioning
var HideTop=0; // Hide first level when loading new document 1 or 0
var MenuWrap=1; // enables/ disables menu wrap 1 or 0
var RightToLeft=0; // enables/ disables right to left unfold 1 or 0
var UnfoldsOnClick=0; // Level 1 unfolds onclick/ onmouseover
var WebMasterCheck=0; // menu tree checking on or off 1 or 0
var ShowArrow=1; // Uses arrow gifs when 1
var KeepHilite=1; // Keep selected path highligthed
var Arrws=['tri.gif',5,10,'tridown.gif',10,5,'trileft.gif',5,10]; // Arrow source, width and height

function BeforeStart(){return}
function AfterBuild(){return}
function BeforeFirstOpen(){return}
function AfterCloseAll(){return}


// Menu tree
// MenuX=new Array(Text to show, Link, background image (optional), number of sub elements, height, width);
// For rollover images set "Text to show" to: "rollover:Image1.jpg:Image2.jpg"

Menu1=new Array("Home","","",3);
Menu1_1=new Array("The Ayllu","The Ayllu.htm","",0,20,150);
Menu1_2=new Array("Acknow","Acknowledgement.htm","",0);
Menu1_3=new Array("Prayer","Prayer.htm","",0);

Menu2=new Array("About Us","","",4);
Menu2_1=new Array("Debra","bio.htm","",0,20,150);
Menu2_2=new Array("Seamus","Seamus.htm","",0);
Menu2_3=new Array("Locations","location.htm","",0);
Menu2_4=new Array("Contact Us","contact.htm","",0);

Menu3=new Array("Services","","",7);
Menu3_1=new Array("Shamanic Healing","http://www.Ayllu.us/Shamanic Healing.htm","",0,20,150);
Menu3_2=new Array("Shamanic Counseling","http://www.Ayllu.us/Shamanic Counseling.htm","",0);
Menu3_3=new Array("Sacred Ceremonies","http://www.Ayllu.us/Sacred Ceremonies.htm","",0);
Menu3_4=new Array("Sacred Body Work","http://www.Ayllu.us/sbw.htm","",0);
Menu3_5=new Array("Full Moon Crystal Bowl","http://www.Ayllu.us/fm.htm","",0);
Menu3_6=new Array("Sound Healing","http://www.Ayllu.us/Sound Healing.htm","",0);
Menu3_7=new Array("LaHo-Chi","http://www.Ayllu.us/lahochi.htm","",0);

Menu4=new Array("Calendar","http://www.ayllu.us/calendar.htm","",0);

Menu5=new Array("Gallery","http://www.ayllu.us/gallery.html","",0);

Menu6=new Array("Articles","","",3);
Menu6_1=new Array("Test 1","http://www.Ayllu.us/blank.htm","",0,20,150);
Menu6_2=new Array("Test 2","http://www.Ayllu.us/blank.htm","",0);
Menu6_3=new Array("Test 3","http://www.Ayllu.us/blank.htm","",0);

Menu7=new Array("Links","http://www.ayllu.us/links.htm","",0);

What is "lb-position" and how is it used? It's used in a lightbox tutorial, and in looking for an explanation I've found it in a handful of places, but I don't know what it is or what it does. Thank you.

Hi, i am simply trying to alert the left position of a css layer.

Javascript:
Code:

var Element = document.getElementById('box');
alert(Element.style.left);

CSS
Code:

#box {position:absolute;
left:150px;
top:150px;
background-color:blue;
height:100;
width:100;}

HTML
Code:

<div id="box">
</div>

The problem is the alert is blank and i can't understand why.

thanks

Hi,

Im trying to change the position of a div when a button is clicked.

The js is:

Code:

function curPos() {
	objDivStrip = document.getElementById('thumbview');
	return objDivStrip.style.top;
}
function up(pos) {
		//get objects
		objImgStrip = document.getElementById('str');
		objDivStrip = document.getElementById('thumbview');
		//Get End position
		var totImg = (objImgStrip.height - 100) / 130;
		var endpos = totImg * 130;
		
		if (pos=endpos)
			{
				return false;
			}
		else
			{
				objDivStrip.style.top = pos - 130;	
			}
		
}

and the html on the button is

Code:

<img id="arrow" src="images/arrow_up.jpg" onclick="up(curPos());" />

The code doesnt work but if anyone could point me in the direction to get it to work your help is greatly appreciated.

Cheers

Sol

I am creating calander control for the 1 year using javascript.the day in which click a table is pop up at absloute position . i want table is popup at relative position where selected date is click.

Here is my code

<script language="javascript" type="text/javascript">
var k=0;
var month;
var pagedata;
var check=0;
var tabledata = '';
var counter = 0;
var editVal=0;
var editRow=0;
var selecteditemcode="";
var counter=0;

function day_title(day_name)
{

mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode(String(day_name));
mycurrent_cell.appendChild(currenttext);

}


function makeArray(n)
{
this.length=n;
for (var i = 1; i <= n; i++)
this[i] = 0
return this
}
var flag=false;
var index;
var tempdata;
var mybody ;
var rowData = new Array();
var colData = new Array();
var mytable

function fill_table(m_name,m_length,mm)
{
counter+=1;

if(k==0)
{
alert(this_month);
k=this_month;

}
else
{

alert(k);
k +=1;
if(k>12)
{
alert(k);
alert(this_year);
if(flag==false)
{

this_year+=1;
flag=true;
alert("IN "+k);
alert("IN "+this_year);
}
}

}
mybody = document.getElementById('showtb');
mytable= document.createElement("table");

mytable.setAttribute("id",+String(m_name)+"_"+String(this_year));
mytablebody = document.createElement("tbody");
head_row = document.createElement("tr");

head_cell = document.createElement("td");
headtext = document.createTextNode(String(m_name)+"_"+String(this_year));


head_cell.appendChild(headtext);
head_cell.setAttribute('colSpan','7');

head_row.appendChild(head_cell);
head_cell.setAttribute('className','titlebar');
head_row.appendChild(head_cell);
mytablebody.appendChild(head_row);

mycurrent_row = document.createElement("tr");
counter+=1;
mycurrent_row.setAttribute("id",String(counter));
mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode("Sun");
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode("Mon");
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode("Tue");
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode("Wed");
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode("Thu");
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode("Fri");
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode("Sat");
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);

mytablebody.appendChild(mycurrent_row);


day=1

if(m_name=="February" )
{

if((this_year%4)==0)
{
m_length +=1;

}

}

pagedata='';
var ddl;
counter +=2;
mycurrent_row = document.createElement("tr");
mycurrent_row.setAttribute("id",counter);

for (var i=1;i<start_day;i++) {


if(start_day<8)
{
mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode(" ");
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
mycurrent_cell.setAttribute('className','promptbox');
mycurrent_row.appendChild(mycurrent_cell);
}




}
var blnFlagFirstline=false;

for (var i=start_day;i<8;i++) {



blnFlagFirstline=true;
alert("this_day "+ this_day+ " i "+ i);

if(blgFlagButtons==false)
{
if(this_day <=day)
{

mycurrent_cell = document.createElement("td");

currenttext = document.createElement("a");
currenttext.setAttribute("href", "javascript:fnDivertedFlight();");
currenttext.setAttribute("onClick","this.blur();");

var txt = document.createTextNode(""+String(day));

currenttext.appendChild(txt);

mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
blgFlagButtons=true;
}
else
{
if(blgFlagButtons==false)
{
mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode(""+String(day));
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
}
else
{
mycurrent_cell = document.createElement("td");

currenttext = document.createElement("a");
currenttext.setAttribute("href", "javascript:fnDivertedFlight();");
currenttext.setAttribute("onClick","this.blur();");
var txt = document.createTextNode(""+String(day));

currenttext.appendChild(txt);

mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);

}
}
}
else
{
mycurrent_cell = document.createElement("td");
currenttext = document.createElement("a");
currenttext.setAttribute("href", "javascript:fnDivertedFlight();");
currenttext.setAttribute("onClick","this.blur();");
var txt = document.createTextNode(""+String(day));

currenttext.appendChild(txt);

mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);

}

day++;


}
if(blnFlagFirstline==true)
{
mytablebody.appendChild(mycurrent_row);
}


counter+=1;
mycurrent_row = document.createElement("tr");
mycurrent_row.setAttribute("id",counter);
while (day <= m_length) {
for (var i=1;i<=7 && day<=m_length;i++) {


if(blgFlagButtons==false)
{
if(this_day <=day)
{
mycurrent_cell = document.createElement("td");
currenttext = document.createElement("a");
currenttext.setAttribute("href", "javascript:fnDivertedFlight();");
currenttext.setAttribute("onClick","this.blur();");
var txt = document.createTextNode(""+String(day));

currenttext.appendChild(txt);

mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
blgFlagButtons=true;

}
else
{
mycurrent_cell = document.createElement("td");
currenttext = document.createTextNode(String(day));
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);

}

}
else
{
mycurrent_cell = document.createElement("td");

currenttext = document.createElement("a");
currenttext.setAttribute("href", "javascript:fnDivertedFlight();");
currenttext.setAttribute("onClick","this.blur();");
var txt = document.createTextNode(""+String(day));

currenttext.appendChild(txt);

mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
}


day++
}
mytablebody.appendChild(mycurrent_row);

counter+=1;
mycurrent_row = document.createElement("tr");
mycurrent_row.setAttribute("id",counter);
}


mytable.appendChild(mytablebody);
mybody.appendChild(mytable);
mytable.setAttribute("border", "10");
//mytable.style.background="aliceblue";
mytable.style.fontFamily="Verdana";
//mytable.style.width="1000px";
mytable.setAttribute("className","promptbox");
mytable.style.fontSize="10pt";
start_day = i



}


var blgFlagButtons;
function fnCalender()
{
blgFlagButtons=false;
month=new makeArray(12)
month[1]="January"
month[2]="February"
month[3]="March"
month[4]="April"
month[5]="May"
month[6]="June"
month[7]="July"
month[8]="August"
month[9]="September"
month[10]="October"
month[11]="November"
month[12]="December"

month_length = new makeArray(12)
month_length[1]=31
month_length[2]=28
month_length[3]=31
month_length[4]=30
month_length[5]=31
month_length[6]=30
month_length[7]=31
month_length[8]=31
month_length[9]=30
month_length[10]=31
month_length[11]=30
month_length[12]=31

today = new Date()

today= new Date("July 13, 2008");//'Wed Oct 29 00:00:00 UTC+530 2008'



this_day = today.getDate()

this_month = today.getMonth()+1


this_year = today.getYear()
this_year = (this_year< 1000) ? this_year + 1900 : this_year;



begin_date = new Date("July 01, "+this_year)

if((this_year%4)==0)
{
start_day = begin_date.getDay()+1
}
else
{
start_day = begin_date.getDay()+1
}


var MhVal;

if(this_day>1)
{

MhVal=this_month;
for(var i=1; i<=13;i++)
{

mon[i]=month[MhVal];
monlen[i]=month_length[MhVal]
MhVal +=1
if(MhVal==13)
{
MhVal=1;
}

}
}
else
{
MhVal=this_month;

for(var i=1; i<=12;i++)
{

mon[i]=month[MhVal];
monlen[i]=month_length[MhVal]
MhVal +=1
if(MhVal==13)
{
MhVal=1;
}

}



}



if (start_day == 1){
start_day = 8
}

if(this_day>1)
{
for (var m = 1;m<=13;m++){
//alert('month[m] - '+mon[m]+' month_length[m] - '+monlen[m]+' m - ' +m);
fill_table(mon[m],monlen[m],m)


// tabledata += "id"+counter+"="+pagedata;
}
}
else
{
for (var n = 1;n<=12;n++){

fill_table(mon[n],monlen[n],n)


}
}


}

</script>

<script language="javascript" type="text/javascript">

function fnDivertedFlight()
{

prompt3('', 'Roster','Diverted Flight Detail </B>', 'fnDivertedValues');

}


function prompt3(promptpicture, prompttitle, message, sendto) {



var posx = 0;
var posy = 0;
var e = window.event;

if(e!=null)
{

if (e.pageX || e.pageY)
{
posx = e.pageX;
posy = e.pageY;
}

else if (e.clientX || e.clientY)
{
posx = e.clientX + document.body.scrollLeft
+ document.documentElement.scrollLeft;
posy = e.clientY + document.body.scrollTop
+ document.documentElement.scrollTop;
}
}
else

{
posx = 100;
posy = 100;


}




promptbox = document.createElement('div');

promptbox.setAttribute ('id' , 'prompt')

document.getElementsByTagName('body')[0].appendChild(promptbox)

promptbox = eval("document.getElementById('prompt').style")

promptbox.position = 'absolute'

promptbox.top = posy

promptbox.left = posx

promptbox.width = 430

promptbox.border = 'outset 1 #bbbbbb'

//Here I am open popup Tabletable
}

function fnDivertedValues(value1,value2,value3,value4,value6,value7,value5)
{


alert(value1+" , "+ value2+" , "+value3+" , "+value4+" , "+value5);

is it possible to make the mouse be at a given position on the screen using javascript for example i am writing a element resize script and i would like to have it so when u click on the resize button the cursor moves to the bottom right corner of the element for the starting position