View Full Version : jQuery Image Magnify do not working with google map balloon
Sergio Tardioli
12-16-2014, 04:06 PM
1) Script Title: jQuery Image Magnify v1.11
2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/imagemagnify.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
12-18-2014, 05:20 PM
There isn't anybody who can help me? :(
jscheuer1
12-19-2014, 04:27 AM
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
12-19-2014, 10:28 AM
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.
5567
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
12-23-2014, 10:20 AM
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
01-07-2015, 06:09 PM
There isn't any way to help me?
Sergio Tardioli
01-12-2015, 12:15 PM
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
Powered by vBulletin® Version 4.2.2 Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.