jQuery Image Magnify do not working with google map balloon

[Sergio Tardioli]

1) Script Title: jQuery Image Magnify v1.11

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...agemagnify.htm

3) Describe problem:

I'm new in the formum and I do not know if this is right section.

When I create an info baloon in google map and insert on it some images, is impossible to zooming that images.
I have inserted the CSS class='magnify' after infoWindow.open baloon and calling jQuery(imageOBJ).imageMagnify({
magnifyby:75
});
but it do not work.

Can you help me?

Regards,

Sergio

Sergio

[Sergio Tardioli]

There isn't anybody who can help me?

[jscheuer1]

Doesn't Google maps have its own zoom in/zoom out functions? If so - with such a complex script as Google maps, it would be best to rely upon it for such features rather than try to take over/augment them with another script like DD's jQuery Image Magnify.

[Sergio Tardioli]

Hi jscheuer1,

thanks for the reply!!

I do not want to zoom in/out the map, but the baloon's images.
As you can see in attachment, I want to zoom the images inside the baloon.



This is the code that I use to create the baloon

var description='<table width=\'300\'<tr><td><img src=\"images/header.png\" width=100% height=100% /><table><strong>'+marker.name+'</strong><hr size=\'5\' color=\'green\' /></td></tr></table></table><style:float><font size=1>';
var WaveIMG=ImgWave+'/'+marker.Network+'.'+marker.code+'.'+marker.priminst;
description+='<img src=\"'+WaveIMG+'Z.png\" style=\"width:50px; height:35px\" id=\"picture1\">';
description+='<img src=\"'+WaveIMG+'N.png\" style=\"width:50px; height:35px\" id=\"picture2\">';
description+='<img src=\"'+WaveIMG+'E.png\" style=\"width:50px; height:35px\" id=\"picture3\"><br/>';

and after create it, I show the image

infoWindow.open(map,marker);
var Pic1=document.getElementById('picture1');
var Pic2=document.getElementById('picture2');
var Pic3=document.getElementById('picture3');
Pic1.class='magnify'
Pic2.class='magnify'
Pic3.class='magnify'
jQuery("#picture1").imageMagnify({
magnifyby:75
});
jQuery("#picture2").imageMagnify({
magnifyby:75
});
jQuery("#picture3").imageMagnify({
magnifyby:75
});

[Sergio Tardioli]

Hi jscheuer1

I don't want zoom image inside map. I have an info baloon that contain images and I want zoom them.
Here is my code:

First of all I fill an infoWindow baloon with text and images

infoWindow.setContent(fumetto);

function faiFumetto(marker)
{
var description='<table width=\'300\'<tr><td><img src=\"images/header.png\" width=100% height=100% /><table><strong>'+marker.name+'</strong><hr size=\'5\' color=\'green\' /></td></tr></table></table><style:float><font size=1>';
var WaveIMG=ImgWave+'/'+marker.Network+'.'+marker.code+'.'+marker.priminst;
description+='<img src=\"'+WaveIMG+'Z.png\" style=\"width:50px; height:35px\" id=\"picture1\">';
description+='<img src=\"'+WaveIMG+'N.png\" style=\"width:50px; height:35px\" id=\"picture2\">';
description+='<img src=\"'+WaveIMG+'E.png\" style=\"width:50px; height:35px\" id=\"picture3\"><br/>';
description=description+'</font>';


return description


Then I open the return of function with

infoWindow.open(map,marker);

after the baloon show, in according with image magnifier instructions, I give that instructions

var Pic1=document.getElementById('picture1');
var Pic2=document.getElementById('picture2');
var Pic3=document.getElementById('picture3');
Pic1.class='magnify'
Pic2.class='magnify'
Pic3.class='magnify'
jQuery("#picture1").imageMagnify({
magnifyby:75
});
jQuery("#picture2").imageMagnify({
magnifyby:75
});
jQuery("#picture3").imageMagnify({
magnifyby:75
});

but it do not work.

Also the modified cursor is not showing.
I have tryed with a static image inside the web page and it's ok, but not with the baloon.
Can you help me?

Sergio

[Sergio Tardioli]

There isn't any way to help me?

[Sergio Tardioli]

Sorry if I insist about imageMagnify.....

I have seen that the jQuery start with jQuery(document).ready(function($)

I thought to restart the jQuery every time I change the baloon's images.
In this way I delete oldest images with magnify's effect and restart the script with the new.
What you think about this?
It is possible?

Regards and thanks

Sergio