SI Works blog

Been working on a clients website, where the aim is to create a nice little pop-up window with an ajax calendar, which we've created ourselves, instead of getting from the web, so what I had to do is write the function to create it, then ... write one to find where we click the little mouse, so that it appear in the correct place.

function getMousePosition ( event )
{
var mouse = [0,0];
if ( typeof event == "undefined" ) {
var event = window.event;
}
if ( event.pageX || event.pageY ) {
mouse[0] = event.pageX;
mouse[1] = event.pageY;
}
else if ( event.clientX || event.clientY ) {
mouse[0] = event.clientX;
mouse[1] = event.clientY;
}
return mouse;
}

Now what this does is finds the mouse, then when I create an absolutely positioned DIV I use this to give it the co-ords. NOW... in Firefox, this weeks, but as usual in IE there is an issue, it takes into consideration the scroll bar, and at what position the scroll bar is at, which is fair enough. so I had to go and write a function to find the scroll position and add that to the mouse position for frikken IE

function getScrollingPosition( ) {
//array for X and Y scroll position
var position = [0, 0];
//if the window.pageYOffset property is supported
if( typeof window.pageYOffset != 'undefined' ) {
//store position values
position = [
window.pageXOffset,
window.pageYOffset
];
}
//if the documentElement.scrollTop property is supported
//and the value is greater than zero
if(typeof document.documentElement.scrollTop != 'undefined' && 
document.documentElement.scrollTop > 0) {
//store position values
position = [
document.documentElement.scrollLeft,
document.documentElement.scrollTop
];
}
//if the body.scrollTop property is supported
else if(typeof document.body.scrollTop != 'undefined') {
//store position values
position = [
document.body.scrollLeft,
document.body.scrollTop
];
}
//return the array
return position;
}

And to combine them it was something like this.

var scrollPosition = getScrollingPosition();
var mousePosition = getMousePosition();

var positionX = mousePosition[0]+scrollPosition[0];
var positionY = mousePosition[1]+scrollPosition[1];

That's about it, it all seems to work now, I can't give you an example at the moment, but I'll try give you one at a later stage.