I couldn't do it your way, so here's what I did
I used this:
http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.0/src/infobox_packed.js
and this is my code:
google.maps.event.addListener(marker, "click", function() {
if (infoBox) infoBox.close();
infoBox = new InfoBox(
{
latlng: marker.getPosition(),
map: map,
content: $("#mydiv").html() //mydiv contains another div
class="infoboxwindow", which is the one I have to style
}
);
infoBox.open(map, marker);
});
I don't understand if there's something wrong with it, provided that
I'd style width and height statically (or via jquery if I want)
On Feb 2, 10:38 pm, pete <[email protected]> wrote:
> The technique covered here is the current way to achieve completely
> custom
> infoWindows:http://gmaps-samples-v3.googlecode.com/svn/trunk/infowindow_custom/in...
>
> Any HTML you append inside here can be styled with CSS and so forth.
>
> Keep in mind because the content is created by javascript injection,
> you can use AJAX to retrieve your dynamic PHP or whatever you need to
> do so.
>
> If you mean you have already created all the mark-up for the box
> itself, basically you need to re-write it with the JS class in that
> example. You don't need to pass inline styles to it
> For example instead of:
>
> div = this.div_ = document.createElement("div");
> div.style.border = "0px none";
> div.style.position = "absolute";
> div.style.background = "url('http://gmaps-samples.googlecode.com/svn/
> trunk/images/blueinfowindow.gif')";
>
> You could easily have
> div = this.div_ = document.createElement("div");
> div.addClass("infoWinContainer");
>
> Then using your CSS you can do what you like to "infoWinContainer".
> Just make sure you leave
>
> div.setStyle("width", this.width_ + "px");
> div.setStyle("height", this.height_ + "px");
>
> Hope this helps you somewhat
> Pete
>
> On Feb 3, 2:58 am, koichirose <[email protected]> wrote:
>
> > Hello, I'm trying to use existing divs in my html source as
> > infowindows (instead of default ones).
>
> > I know I can set the content to whatever I want by doing:
> > infowindow = new google.maps.InfoWindow({content: $("#my_div").html
> > ()}); //this uses jquery;
>
> > but I want to style the infowindow itself as an existing div on my
> > page (which is, of course, hidden).
>
> > All the examples I found create and style the div dinamically with
> > javascript, while my div is already created via php+html+css and I
> > just want to display it when I click on a marker.
>
> > Is there a way to do this? How?
>
> > Thank you!
--
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 [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-maps-js-api-v3?hl=en.
