top en left of element in infowindow differs per browser

[Nico Oudshoorn]

I have a map with a marker and an infowindow with a form. In the form you can open a calander beyond the date element. In IE and safari this works fine. In Chrome and FF the calendar opens somewhere outside the document. If you have luck you can see a glimp of it. In FF5 even the dropdown boxes appear somewhere on the screen and you can only select via arrow up and down.

 

you can test it here http://www.meerijden.nu/ritinvoerenmapsepo.php?codet=en. I have the alerts for the calendar top and left still active so you can see the differences..

 

I hope someone has a solution.

 

Thanks, Nico Oudshoorn.

[Nico Oudshoorn]

Is there anybody going to listen to my story all about the infowindow that doesn't work? Am I the only one with this problem? Or isn't this problem interesting? Or is there some problem with the rpesentation of the problem? Or ....

 

Please, any reaction!

[xelawho]

it looks like a css thing (different browsers read css differently),
but it's really hard to tell - there's so much other code going on.
Maybe if you could make a simple map representing the problem in
isolation?

[Rossko]

It's such a maze of code it's difficult to see what goes on. I don't
actually see your problem in old FF2. What offset values do you see
when it goes wrong?

How about producing a simple example ; a map, a fixed marker, and
infowindow with your calendar

I rather suspect the five year old calendar javascript that you have
chosen is not coping very well with newer browsers.

[Nico Oudshoorn]

Thanks foor recations. Now we can talk. In Chrome where is goed wrong I get a top of minus 228px and a left of 823px. Maybe this can a little bit differ depending where the infowindow is located. You can't see the calendat.

 

In FF the top is also minus. In IE and Safari the top resp 273 and 265 and left is 669 and 667 and the calendar is at the right place. 

 

Maybe this is already helpful to you. If you test is yourself, the alerts that give the offsets are still in the page.

 

I will try to get you a simple example within ...

 

Thanks, Nico.

[Rossko]

> Maybe this is already helpful to you.

It's not a maps issue.
I think you need to be working towards updating your chosen calendar
tool Epoch to be more compatible with newer browsers, which do seem
quirky about offsets and whatto use as offsetParent.
There is a support forum
http://www.epoch-calendar.com/forums/index.php
but last posting was over two years ago.

Having said that, I don't think you are using the newest version of
that tool anyway.

Or choose a more recent tool like
http://code.google.com/p/prototype-datepicker-widget/
or one of these
http://www.google.com/search?q=jquery+calendar+picker

[Nico Oudshoorn]

http://www.meerijden.nu/kaltest.php is a simple test of the problem. It has to do with the calculation of the top and left offset. If you select a date you get the target name and top-offset of every parent of the date element and finaly the top and left offset of the calendar.. So you can compare this in IE and Chrome.

 

This is the way the top offset is calculated by epoch:

Epoch.prototype.getTop = function (element) //PRIVATE: returns the absolute Top value of element, in pixels
{
    var oNode = element;
    var iTop = 0;
   
    while(oNode != null && oNode.tagName != 'BODY') {
alert(oNode.tagName);
alert(oNode.offsetTop);
        iTop += oNode.offsetTop;
        oNode = oNode.offsetParent;
    }
   
    return iTop;

 

The calendar is wrong positioned in Chrome. BUT if you leave out the height parameter in the div in kaltes than it also in Chrome the positiong is good.

 

AND if you have the same div outside an infowindow and outside the map than it functions also well.

 

My conclusion is that it has to do with the offset calculation in an infowindow and that it is also dependent the way the date element is written in the page.

 

I hope that this will be helpfull to come to a solution.

 

Nico. 

[Rossko]

> My conclusion is that it has to do with the offset calculation in an
> infowindow and that it is also dependent the way the date element is written
> in the page.

I'm sure it is. It's to do with the way Epoch uses getTop and
browsers like Chrome calculate offsetParent. Infowindow does what it
does, Chrome does what it does, Epoch can't cope with that. Look into
how jquery manages this area if you want a fix to apply to Epoch.

If you like, try a later version of Epoch.

[Nico Meerijden]

I think I changed epoch to be the best now. The calendars you recommended
have the problem that if you have two date fields beyond each other, as I
did, the bottom date field shows before the calendar of the the top date
field.

> --
> You received this message because you are subscribed to the Google Groups
> "Google Maps JavaScript API v3" group.
> To post to this group, send email to
> google-map...@googlegroups.com.
> To unsubscribe from this group, send email to
> google-maps-js-a...@googlegroups.com.
> For more options, visit this group at
> http://groups.google.com/group/google-maps-js-api-v3?hl=en.
>