How to show map from Google? - problem with size

[Rene]

Hi,

I have a page which is just a DIV containing a map from Google.
Although fancybox is set to autoscale, the DIV does not fit and
scrollbars are displayed. Any ideas what's going wrong?

This is the map: http://balteringe.de/neu/lageplan.html

And this is the way I have integrated the map:

<td>
<a href="http://www.balteringe.de/neu/lageplan.html" rel="fancy"
class="iframe" title="Lageplan">
<img src="Bilder/Hausbeschreibung/Lageplan_s.jpg" width="110"
height="90" alt="" />
</a>
</td>

And this is the function that configures a standard fancybox:

$("a[rel=fancy]").fancybox({
'titleShow' : true,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
});
$("a[rel=panorama]").fancybox({
'titleShow' : true,
'autoScale' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
});
$("a[class=iframe]").fancybox({
'titleShow' : true,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
});

Any ideas what is going wrong?

Rene

--
You received this message because you are subscribed to the Google Groups "fancybox" group.
To post to this group, send email to fanc...@googlegroups.com.
To unsubscribe from this group, send email to fancybox+u...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/fancybox?hl=en.

[JFK]

Opening google maps the easy way:
(yes, I know, it's a workaround ... very handy btw)

1. Open google maps and customize the map you want
2. select the link option and copy from "Paste HTML to embed in
website" and paste it into your HTML editor
3. extract the content from the src="" attribute (don't select the
quotes"", only the ref), and cut it
4. paste the content in you <a tag href=" ">

so you get something like:
<a class="gmap" href="http://maps.google.ca/maps?
f=q&source........">open my map</a>

then use this script:
<script type="text/javascript">
$(document).ready(function() {
$("a.gmap").fancybox({
'padding': 0, // optional
'width': 640, //or whatever you like
'height': 380,
'type': 'iframe'
});
}); // ready
</script>

[Rene]

On 7 Mai, 20:19, JFK <jfk.d...@gmail.com> wrote:

> 'width': 640, //or whatever you like
> 'height': 380,

That gave me the right hint. I had tried 'width' : '600px' which did
not work. Now I have taken the actual size of the DIV and added 18px
which seems to be fine. Would be nice if fancybox would either adapt
to the size of the embedded content or show scrollbars automatically.

Thx for the help!

Another question: I had to remove the Google map from the gallery as
the back button covered the zoom controls which got unusable. Is there
a way to move the back and forward buttons away from the content? And
is there a way to have those buttons visible all the time?

[JFK]

>Is there a way to move the back and forward buttons
>away from the content? And > is there a way to
>have those buttons visible all the time?

you are asking for too much workarounds today, aren't you?

try this inline css (after you have loaded your fancybox css file) to
override the buttons/arrows style

<style type="text/css">
#fancybox-left-ico,
#fancybox-left span {
left: -30px !important;
}

#fancybox-right-ico,
#fancybox-left span {
right: -30px !important;
left: auto;
}
</style>

[Rene]

On 7 Mai, 21:07, JFK <jfk.d...@gmail.com> wrote:

> you are asking for too much workarounds today, aren't you?

Am I? ;-)

Maybe this is the best moment to say "thanks for the work arounds" and
please make it possible to easily integrate Google maps into fancybox
and especially into galleries maybe in 1.3.2 or 1.4 or whatever (all
the pitfalls should be known now). Great script though. Best I have
seen so far.

[JFK]

you could also integrate your google maps into any gallery, just add
the same rel attribute
and regarding your "wish list" requests, let's the developer/fancybox
creator to decide ... I am just helping with support here (with some
workarounds)