| View previous topic :: View next topic |
| Author |
Message |
rse 100+ Club
Joined: 10 Oct 2004 Posts: 114 Location: Leeds, UK
|
Posted: Fri Mar 14, 2008 2:39 pm Post subject: Javascript "popup" problems |
|
|
Hi,
I've been working on some functions which are intended to load a bubble to the top left of the image which initiates the onclick event. The purpose is to provide a link for the user to add a product to the basket or return to the site. The page I am using it on to give you an idea of my goal is at http://loveall.stage.i-sitedigital.co.uk/products/test_new_category/stretchy_pants/big_pants_(test-b) .
The problems I am having are as follows:
When I click on the the image the function is called correctly but then if i click the same image again the box moves up and to the left each time, its like the mouse position is not resetting itself.
Also, in Internet Explorer I get an error "Invalid Argument" in IE which I can't get around... but it seems to be caused by the event that checks the mouse position.
Finally in Safari the box shows below the image rather than the top... This ones not crucial - its just a pain!
My code is as follows:
| Code: |
var posx;var posy;
function getMouse(e){
posx=0;posy=0;
var ev=(!e)?window.event:e;//IE:Moz
if (ev.pageX){//Moz
posx=ev.pageX+window.pageXOffset;
posy=ev.pageY+window.pageYOffset;
}
else if(ev.clientX){//IE
//compliant mode vs. quirk mode
var sLeft=document.documentElement?document.documentElement.scrollLeft:document.body.scrollLeft;
var sTop=document.documentElement?document.documentElement.scrollTop:document.body.scrollTop;
posx=ev.clientX+sLeft;
posy=ev.clientY+sTop;
}
else{return false;}//old browsers
document.getElementById('mydiv').firstChild.data='X='+posx+' Y='+posy;
}
document.onmousemove=getMouse;
function theFloater(id) {
var newdiv = document.createElement('div');
var divIdName = 'theFloater';
var winy = "130";
var winx = "230";
posx = posx - winx - 15;
posy = posy - winy - 15;
newdiv.setAttribute('id',divIdName);
newdiv.style.width = winx+"px";
newdiv.style.height = winy+"px";
newdiv.style.zIndex = "1000";
newdiv.style.top = posy+'px';
newdiv.style.left = posx+'px';
newdiv.style.position = "absolute";
newdiv.style.background = "#ffffff";
newdiv.style.border = "none";
newdiv.innerHTML = '<a href="javascript:closeTheFloater(\''+divIdName+'\')">Close Window</a><h1>' + id + '</h1>';
document.body.appendChild(newdiv);
document.getElementById(productCode).className='clear';
}
function closeTheFloater(id) {
var theDiv = document.getElementById(id);
theDiv.style.visibility = "hidden";
}
|
Any help would be so much appreciated... this is key to my sites spec so I need to find a way to make this work.
Thank you so much in advance .
- Adam |
|
| Back to top |
|
 |
|
|
rse 100+ Club
Joined: 10 Oct 2004 Posts: 114 Location: Leeds, UK
|
|
| Back to top |
|
 |
rangana 250+ Club

Joined: 27 Feb 2008 Posts: 271 Location: Cebu City Philippines
|
Posted: Sat Mar 15, 2008 1:23 am Post subject: Re: Javascript "popup" problems |
|
|
Seems okay to me in IE7  |
|
| Back to top |
|
 |
|