[module] product image magnify

[Marghoob Suleman 10]

Hi Guys,

This is my first module. however i've already uploaded some module updates.

About this module and Features:

This is image enlarger. Visit here http://www.giftlelo.com/cart3/ for live demo.

1. when you rollover on any of product image it will show an enlarge image.
2. Working on all listing page. (best seller, new products, etc)
3. no need have external css, you can control in javascript.
4. you can on/off animation effect by changing value in js (find this line: useAnimation:1,//make it zero if you dont want to animate)
5. you can install and uninstall anytime.
6. its free

I've tested with FF and IE 7. Please tell if you find any bug.

How to install:
extract the imagesenlarge.zip file. copy and paste into the modules directory. Go to admin panel click on MODULES tab find a module under 'Utilities' section. click on INSTALL button.

Your feedback please

Thanks and Regards,
Marghoob Suleman

----------------------
Date: 19th Jan, 2009

Guys i've updated imagesenlarge. Yes there was a bug.
I've tested it with ff, opera, netscape, and ie7 & 8. It is working fine now.

Please tell if there is any bug. Thank you for using this.

Regards,
MS

------------
25th Jan, 2009

Hello again,
I would suggest to use my imagesenlarge (v1.1) module. v1.1 works with homepagefeatued products too.

Download latest files from here.
http://www.marghoobsuleman.com/node/77

your feedback/bugs are always welcome on my site.


Thank you!


------------
05th Feb, 2009

Hi All,
Imagesenlarge (v1.2) module has arrived.

Download latest files from here.
http://www.marghoobsuleman.com/node/77

your feedback/bugs are always welcome on my site.


Thank you!

imagesenlarge.zip

[mandrake 11]

It's great!
But it does not work on my site online :down: with IE7 but work with my firefox 3...
On your site, I looked great!
Where is the problem?

Thank you for your answer!

(IE7)=no (FF3=Yes!)

[Tab 0]

Marghoob,


I really wanted to thank you for doing the work that you have done so far on the Image Script.

I am going to implement this one also.

Thanks
Tsunami

www.biggiesurf.com

[mandrake 11]

Good evening Marghoob,

I also note that the links of "Category block" disappear after you install your module. (with IE7, but it's ok on FIREFOX 3)

Thank you for your solution.

[Ehinarr 31]

It works fine in opera 9.63!

[mandrake 11]

Hi Ehinarr,

Too bad for IE7,

It is the most important of all to sell in volume ...

I am sure he will find soltion!

Best regards,

Mandrake.

(Very good ehinarr.wordpress.com !)

[Marghoob Suleman 10]

Guys i’ve updated imagesenlarge. Yes there was a bug.
I’ve tested it with ff, opera, netscape, and ie7 & 8. It is working fine now.

Please tell if there is any bug. Thank you for using this.

Regards,
MS

[jolvil 78]

Very good module ! so easy to install in 5 minutes

Works fine on my shop ! animation off

great job !

thanks a lot

[TropischBruin 10]

Thank you!

I've added a link to this topic from my forum.

[Jiri FAMiNE Cermak 1]

Wow, really nice module works fine on all browsers I have installed... thanks!

[adiboo 0]

Hi great module it's work only on your demo web , i tested on 2 sites but doesn't work (IE7.ie8.opera.firefox3) you have an idea.
thinks

[Prestafreak™ 1]

Thanks Marghoob, its a great module, it works in my site. I'm waiting your next module... :-)

[Marghoob Suleman 10]

Hi great module it's work only on your demo web , i tested on 2 sites but doesn't work (IE7.ie8.opera.firefox3) you have an idea.
thinks

Please clear your browser/server cache. and could you give me url where i can see that.

[adiboo 0]

there's my site www.instinctbio.fr
thank you

[Marghoob Suleman 10]

there's my site www.instinctbio.fr
thank you

Have you uploaded imagesenlarge folder under modules folder.
If yes. Did you install? did you follow the instruction?

if yes you can pm me your admin user name and password. you can always change your password later.

[pergame 0]

One of the best free module outthere
Thanks man It work ok in v1.0 and 1.1
2 minutes to install.
Looks beautifull, expensive, usefull.


Anyway million 10x

[mandrake 11]

Hi Marghoob,

It's great, the module now works with IE7!
Excellent work! Thank you a thousand times, it was a missing vital for my site!
Good day!

Best regards,

Mandrake.

[adiboo 0]

yes i uploaded imagesenlarge folder and installed it .
i tested on local and he work great but doesn't work on my distant site.
thinks

[capclem 0]

Thank you for this great job!
Question: The zoom does not work for the products of the home, is it normal?

[Marghoob Suleman 10]

yes thatz normal. You can find the same in homepage modified module.

and thank you all for using and appreciation.

[AngelofHaovc 0]

Very nice! Good Job Marghoob Suleman

[samsee 0]

How to install:
extract the imagesenlarge.zip file. copy and paste into the modules directory. Go to admin panel click on MODULES tab find a module under ‘Utilities’ section. click on INSTALL button.

i have follow your instruction until "extract the imagesenlarge.zip file. copy and paste into the modules directory. Go to admin panel click on MODULES tab find a module"

where is ‘Utilities’ section i use PS 1.1 and i can't find the modul on BO and what is the name on BO modules...can you explain more how to install.



regards

[Marghoob Suleman 10]

How to install:
extract the imagesenlarge.zip file. copy and paste into the modules directory. Go to admin panel click on MODULES tab find a module under ‘Utilities’ section. click on INSTALL button.

i have follow your instruction until "extract the imagesenlarge.zip file. copy and paste into the modules directory. Go to admin panel click on MODULES tab find a module"

where is ‘Utilities’ section i use PS 1.1 and i can't find the modul on BO and what is the name on BO modules...can you explain more how to install.



regards

I've attached one more pic in first topic.

[samsee 0]

yeah it's awesome modules..thanks dude for your great job and for quick response....

[mandrake 11]

Hi Marghoob,

Downloads modules are not available on your site (404 error)
How to download?
Thank you for your answer,

Kinds regards,

Mandrake.

[Marghoob Suleman 10]

Thanks mandrake,

Thanks for telling me. I was updating my site and all attached files got erased automatically

Well, Its available now. Thanks again,

You are such a nice person!

Best Regards,
Marghoob Suleman

Hi Marghoob,

Downloads modules are not available on your site (404 error)
How to download?
Thank you for your answer,

Kinds regards,

Mandrake.

[mandrake 11]

Hi Marghoob,

Thank you for your excellent work!

You, you are such a nice person!

Best regards,

Mandrake.

[Star 16]

Hi Marghoob Suleman,

I know I have told you before. But I want to say it one more time. Your modules are great and thank you again for all of the work. The product image magnify module works great. Thanks.

[Marghoob Suleman 10]

A big thanks to all for the appreciation. feels good

Good news...

Images enlarge (v1.2) module has arrived.

Download latest files from here.
http://www.marghoobsuleman.com/node/77

your feedback/bugs are always welcome on my site.

Thank you!

[Jack 0]

A big thanks to all for the appreciation. feels good

Good news...

Images enlarge (v1.2) module has arrived.

Download latest files from here.
http://www.marghoobsuleman.com/node/77

your feedback/bugs are always welcome on my site.

Thank you!

Hi Marghoob Suleman,

Thank you for the great module, I am very appreciated it. I just visited your site, and there are 3 different download links for this module. Do I need to download all of them and installed? Are they different? Do they have different functions for different part of the PrestaShop? Or I only need the imagesenlarge_v1_2.zip 13.41 KB? I have already installed the v1.0 module before and it works. Do I updated this module by add this imagesenlarge_v1_2.zip 13.41 KB on the top of the old one? Or do I need to uninstall the v1.0, and install this v1.2? Thank you very much for all of your help.

[Star 16]

Jack,

PM me and I will show you how...

[mandrake 11]

Hi Marghoob ,

A BIG thank you for your extraordinary work, if I can make you a service to your website, send me a PM.
I am at your disposal,

Best regards,

Mandrake.

[qasrani 1]

Thanks a lot مرغوب سلیمان! Keep on doing nice job

[Marghoob Suleman 10]

OMG!

Thanks a lot Mandrake!

Hi Marghoob ,

A BIG thank you for your extraordinary work, if I can make you a service to your website, send me a PM.
I am at your disposal,

Best regards,

Mandrake.

[Marghoob Suleman 10]

Hey thanks...

how did you write in urdu?

Thanks a lot مرغوب سلیمان! Keep on doing nice job

[shaqo999 0]

Ok working with no problem ...
www.asmercan.com



Thanx a lot brother مرغوب سلیمان! ...!

[Marghoob Suleman 10]

Thanks bro... again... how do you guys write in Urdu.

Ok working with no problem ...
www.asmercan.com



Thanx a lot brother مرغوب سلیمان! ...!

[shaqo999 0]

Thanks bro... again... how do you guys write in Urdu.

Ok working with no problem ...
www.asmercan.com



Thanx a lot brother مرغوب سلیمان! ...!

I can't write I just copied from "qasrani"... But I can read Arabic. Couse I'm Muslim (Alhamdulillah)
And I'm Turkish
You know where is TURKEY....? Our PM gave a lesson to Shimon Peres a.k.a Baby Killer.
Check This Out : http://www.huliq.com/1/76900/pm-erdoghan-i-will-never-come-davos
Somebody had to do this...
S.A

[qasrani 1]

Writing urdu quite easy. If you use windows vista, you just need to enable keyboard and language. If you use XP or linux, let me know. I send you detailed instructions how to install and enable Urdu language and Keyboard settings. Do not get confused with DETAILED INSTRUCTIONS word, it is just few minutes job. I bet you are gonna love it

[capclem 0]

Thank you for this module! A great tool!

I installed the 1.2 version, and I lost the grey frame, how to put back it?

Is it possible to have the Magnifying glass effect in more or on the place of thickbox in the product sheet?

Thank you!

[shaqo999 0]

Writing urdu quite easy. If you use windows vista, you just need to enable keyboard and language. If you use XP or linux, let me know. I send you detailed instructions how to install and enable Urdu language and Keyboard settings. Do not get confused with DETAILED INSTRUCTIONS word, it is just few minutes job. I bet you are gonna love it

I'm using MAc OsX Bro

[Marghoob Suleman 10]

Hey thatz a good idea. and ofcourse you can modify that. open css file from the same folder. replace this

#msBigImageHolder {
   width:300px;
   height:300px;
   overflow:hidden;
   display:none;
   position:absolute;
   background:#ffffff;
   margin-left:4px;
   padding:10px;
}

to this

#msBigImageHolder {
   width:300px;
   height:300px;
   overflow:hidden;
   display:none;
   position:absolute;
   background:#ffffff;
   margin-left:4px;
   padding:10px;
   border:2px solid #c3c3c3;
}

everything is same but border:2px solid #c3c3c3;

Thank you for this module! A great tool!

I installed the 1.2 version, and I lost the grey frame, how to put back it?

Is it possible to have the Magnifying glass effect in more or on the place of thickbox in the product sheet?

Thank you!

[capclem 0]

Thank you !

[lehangart 1]

Thanks a lot....
It's a great module; and it works fine!!!!

[Noxyd 1]

Hello and thanks a lot for your good job.
I've a little trouble with the "magic zoom", it doesn't works with me :
I only can see a black picture (perhaps the background?).
But the image enlarger works very well (magic zoom off).
If you could find what goes wrong with my magic zoom, it'll be great.

Thank again.

Arnaud

[Ánh Nga 8]

yes i uploaded imagesenlarge folder and installed it .
i tested on local and he work great but doesn't work on my distant site.
thinks

Yes, me too, it not work on my site
www.anhduongmobile.com

Test in localhost it work perfect, but up load to my host it not work again....?

Could somebody know why?

How to resolved it?

Thank!

[Ánh Nga 8]

yes i uploaded imagesenlarge folder and installed it .
i tested on local and he work great but doesn't work on my distant site.
thinks

Yes, me too, it not work on my site
www.anhduongmobile.com

Test in localhost it work perfect, but up load to my host it not work again....?

Could somebody know why?

How to resolved it?

Thank!

Hi...hi...

I resolved my problem....

It so easy...

Because this module hook to top, but i removed {hooktop} in my header.tpl and this module not show again...

Modify file imagesenlarge.php let it hook to left or rightcolum --->that it...

Thank again for this great module

[Mario 0]

I've the Problem that the enlarger is not working anymore on featured products on home page.

I I go to categorie it is working again...

see CuoreSportivo-shop

[Mario 0]

solved Problem

[Ozzy2662 0]

I have installed it and it works very well in FF, but in IE 7 & 8 I get extra vertical lines to the right of the image, maybe from the image animation or the black theme background!

[nherd 0]

Thanks for the great module.

[langbianiam 0]

Marghoob Suleman,
Thanks for your share

[Akshan 0]

Hello and thanks a lot for this module..

No problem..Good working this site www.muhre.com.tr Very nice site..

[lehangart 1]

It's working fine but when I use the magic zoom I can't see all the picture...
A part (right and down) of the picture is missing.
How can i do?
Thanks

[Noxyd 1]

Hello,
I've found the answer to my problem, I had to modify the var ratio to adapt it to my images size :
- open the imagesenlarge.js (in "module/imagesenlarge) with the windows "bloc note"
- find the line "var ratio" under "showClipedimage: function(e)"
- you have to calculate the ratio which fits well to your thickbox size (in preference-> image), for exemple, I modified mine to 2300ppp to have a better resolution, that's why I could only see a little part of my image with the imageenlarger.
this is the calcul :
((your Thickbox size in ppp) / 300 (it's the enlarger windows size)) X 200 (to keep the 1/200e ratio size which fit to the program) = your var ratio
for exemple with my thickbox size (2300ppp):
2300 / 300 = 7.666666666
7.66666666 X 200 = 1533.33333333 (use the scientific calculator of Windows to have 8 numbers after the dot)
1533.33333333 is the perfect ratio for my image size (or resolution)

So, see the picture to see what it does "in fine" with my thickbox size (2300ppp):



I hope it will help some like me which had modify the thickbox size...
Have a good time, and thanks again to Marghoob Suleman for his good job.

Arnaud (France)

PS : excuse me if my English is not very good...

[lehangart 1]

Thank you to Noxyd; I think that this modif can resolve my problem!!!

[snowki 0]

Hi, I have a question Please,
What is the solution for use the image magnify in all products catégory and for remove the original thickbox ?? thanks you

[snowki 0]

Hi, I have a question Please,
What is the solution for use the image magnify in all products catégory and for remove the original thickbox ?? ( for enlarge in full screen )

Sorry for my english is not the best )

Thanks you

[Me 8084 2]

I have the same question as snowki

1- when I use magic zoom I see only a part of the zoomed image only the corner the rest of image is missing

2- how can I use it for full image size instead of the thickbox?

[Me 8084 2]

I have tried you solution Noxyd but it did not solve my problem unfortunately

can any one help please

[Presta-TR 9]

i am not worked in v1.1
have resolve?

[Don 0]

That was very wonderful, Thank you very much!

[blasto 2]

Hi !

How can i put this enlarger module on the product details page only, plz ?

thx

[blasto 2]

Up plz !

[Sdezign 0]

Merci un petit module sympa

[qasrani 1]

Have you tried it on IE 6.0? Still a lot of people suffering from IE 6.0

[djey 0]

Hi,

It doesn't work on Version 1.1.0.5 ??

thanks

[pouet 0]

Hi,

is it possible to add title, reference, details etc. on the image ?

[powerbizz 0]

Hi, I've download this module (v1.3), but it doesn't work (IE8 & firefox3).
my webiste is : http://alliances-platine.com/
can you help me please ?

[Alekhine 1]

Thank you !

(v1.3 IE8 / FF3 work fine here..)

[Alekhine 1]

Hello

I changed the template of my site, ImageEnlarge did not work any more because the new template uses new images formats ( wide.jpg and widemedium.jpg ).

I found a very simple solution, maybe that can help others users to adapt it for their templates.

Concerned Template (demo): http://www.themesremix.com/17-clean-theme.html



Modifications:

In "imagesenlarge.js"

Original Code:

   setID: function(id, path) {
       var sID = id;
       var sPath = path;
       var imgPath = this.getImagePath(sPath);
       var extract = sPath.split("/");
       var imgName = extract[extract.length-1];
       var largeImg = imgPath+imgName.substr(0, imgName.length-9)+"-large.jpg";
       var thickImg = imgPath+imgName.substr(0, imgName.length-9)+"-thickbox.jpg";
       var homeImg = imgPath+imgName.substr(0, imgName.length-9)+"-home.jpg";
       var smallImg = imgPath+imgName.substr(0, imgName.length-9)+"-small.jpg";        ImagesEnlarge.settings.imageArray[sID] = {small:smallImg, home:homeImg, large:largeImg, thickbox:thickImg};
   },

Modified Code:

   setID: function(id, path) {
       var sID = id;
       var sPath = path;
       var imgPath = this.getImagePath(sPath);
       var extract = sPath.split("/");
       var imgName = extract[extract.length-1];
       var largeImg = imgPath+imgName.substr(0, imgName.length-15)+"-large.jpg";
       var thickImg = imgPath+imgName.substr(0, imgName.length-15)+"-thickbox.jpg";
       var homeImg = imgPath+imgName.substr(0, imgName.length-15)+"-home.jpg";
       var smallImg = imgPath+imgName.substr(0, imgName.length-15)+"-small.jpg";
       var wideImg = imgPath+imgName.substr(0, imgName.length-15)+"-wide.jpg";
       var widemediumImg = imgPath+imgName.substr(0, imgName.length-15)+"-widemedium.jpg";        
       ImagesEnlarge.settings.imageArray[sID] = {small:smallImg, home:homeImg, large:largeImg, thickbox:thickImg, wide:wideImg, widemedium:widemediumImg};
   },

In imagesenlarge.css
Change border colour (blue to green)

#msBigImageHolder {
...
...
...
   border:5px solid #80DD22;
}

Alek.

[juanpax 0]

Thx Marghoob, a great work with this addon, it look very very nice, and works perfect under FF3 and IE8, no problems for me, great!!!

just, keep on surprising us!!! ;p

[trusktr 1]

Hey Marghoob, can you help explain exactly what is being done below? I can't get my pictures to fit corectly inside the zoom box! My pictures are 638 x 402 (width x height). I have no idea what to do with the numbers!

I'm simply trying to align the pictures like on your site: when you go to one edge on thumbnail, the zoomed picture goes to the same edge, etc.. same with top and bottom.

Thanks Marghoob, this is a Amazing module/plugin!

Hello,
I've found the answer to my problem, I had to modify the var ratio to adapt it to my images size :
- open the imagesenlarge.js (in "module/imagesenlarge) with the windows "bloc note"
- find the line "var ratio" under "showClipedimage: function(e)"
- you have to calculate the ratio which fits well to your thickbox size (in preference-> image), for exemple, I modified mine to 2300ppp to have a better resolution, that's why I could only see a little part of my image with the imageenlarger.
this is the calcul :
((your Thickbox size in ppp) / 300 (it's the enlarger windows size)) X 200 (to keep the 1/200e ratio size which fit to the program) = your var ratio
for exemple with my thickbox size (2300ppp):
2300 / 300 = 7.666666666
7.66666666 X 200 = 1533.33333333 (use the scientific calculator of Windows to have 8 numbers after the dot)
1533.33333333 is the perfect ratio for my image size (or resolution)

So, see the picture to see what it does "in fine" with my thickbox size (2300ppp):



I hope it will help some like me which had modify the thickbox size...
Have a good time, and thanks again to Marghoob Suleman for his good job.

Arnaud (France)

PS : excuse me if my English is not very good...

[Mephivio 10]

hi all,

this module worked perfectky under PS 1.1
but it doesn't work with Prestashop 1.2 since i did the upgrade
any idea ?

thx

[dagota 0]

Hi !

It's work very well with PS 1.2 stable but you need to edit some code please find in this url

http://www.homepage-community.de/open_source_softwarelosungen/prestashop_modul_imageenlarger_friendly_url-t478.0.html

[ukbaz 36]

Friendly URL problem - Hi this doesn't enlarge images with friendly URL enabled. Works fine without.

Can someone please post code fix on this forum, as I cannot access the German one - even if I do register there.
Thanks
Barry

[dagota 0]

Hello

You need to edit file imagenlarge.js with the following code.

Code:

// Edit: 28.07.2009, HPC http://www.homepage-community.de/index.php?topic=478.0

//var largeImg = imgPath+imgName.substr(0, imgName.length-9)+"-large.jpg";
//var thickImg = imgPath+imgName.substr(0, imgName.length-9)+"-thickbox.jpg";
//var homeImg = imgPath+imgName.substr(0, imgName.length-9)+"-home.jpg";
//var smallImg = imgPath+imgName.substr(0, imgName.length-9)+"-small.jpg";

// it works with and without friendly url
var largeImg = imgPath.replace(/-home/,"-large")+imgName.substr(0, imgName.length-9)+".jpg";
var thickImg = imgPath.replace(/-home/,"-thickbox")+imgName.substr(0, imgName.length-9)+".jpg";
var homeImg = imgPath.replace(/-home/,"-home")+imgName.substr(0, imgName.length-9)+".jpg";
var smallImg = imgPath.replace(/-home/,"-small")+imgName.substr(0, imgName.length-9)+".jpg";

[ukbaz 36]

Hi Dagota

Thanks for the code update - have edited as you described, but get a javascipt error on the page, and no images magnify
Javascript error is as follows:
"Line 63, Char 3, "imgName' is undefined.

Any idea what is wrong?

Thanks
Barry

[dagota 0]

Hi

Could you please try this one.

imagesenlarge.js

[ukbaz 36]

Hi Dagota.

Works brilliantly!

Just noticed the copy/paste from here altered quotes.

Thanks for all your help.

Barry

[diamond204 2]

Thank you Marghoob for this great module!

And also thanks Dagota for the js file fix - I can confirm the same issue with Prestashop 1.2.1 with Friendly URLs turned on

[VIXUS 6]

i cant make this work on 1.2.2 (even with this js update)

Can anyone confirm?

[space 0]

I've fixed myself to solve friendly URL bugs...
You could try this file which works

Sam_

imagesenlarge.js

[Katzele 7]

Hi

Could you please try this one.

Thank you so much !!! I had delete the module since I upgrade to the 1.2 and now it works with 1.2.4, thanks again !

[space 0]

You're welcome ! ;-)

[ShowYou 17]

Hi,
I'm French. Thanks for this module.
I would want to use imageenlarge with all images in my shop (images product, images in other block or carousel..)
Can you help me ?

[infoseek 3]

first big thx Marghoob for the great module

I have downloaded your module V1.3,still it won't work in prestashop version 1.2.4,I wonder if you can give a update for the newest version 1.2.4

[Unsought_ 0]

Hi there...

After installing it doesn't appear in my modules...

Maybe this version is only ok for the older versions??

Maybe you have an updated version ??

Kind regards Patrick

EDIT

SORRY it does appear now...

I didn't know i had to upload it manually...

But it doesn't work for me ...

It does enlarge but the category links disappears....

Strange!

[enigma32 5]

like everything else i ever try to use it doesnt work on my site ugh

[pibrom 0]

Hi everyone,

I installed this module on several PS Websites. Works well, thanks !

A little clue : If you change the value of the thickbox image, you'll have to modify the imagesenlarge.js, line 137 :

var ratio = 232.5581395;

into a value corresponding to the dimensions of your tickbox images.

[KeNdO.83 4]

Hi ! Very great module ! Thanks
But it only works on version 1.3 ... This is normal?

[Kentaro Tuason 0]

Hi Mahood

Awesome plugin! Hey just would like to ask though is the image enlarger plugin workable on the product sheet page? it seems to work with the other pages like on the home page and product category section but doesn't seem to work on the product sheet page where details and specifics is shown. Advice greatly appreciated.

cheers.!

[PAYGwebsites 0]

Hi im looking to get my images to display in image box like you have on your site, please can you advise?

Thanks
Anthony

[scottyboy 2]

Hey, great plugin. Thanks

[outlet.ee 9]

Does anybody else have this, that if you hover the image which is relatively close to the bottom of browser border, the enlarged image is half way hidden behind the browser border (see the attached image). I would like to have the enlarged image to be centered.

[paquitojuan 0]

hi all,

I'm French and I installed the v1.3 module with the new file imagelarge.js.
The problem that does not work on my site, I have the image that becomes my mouse in the zoom.

Make a test on my website: www.media-discount.fr

Thank you to you

[diamond204 2]

hi all,

I'm French and I installed the v1.3 module with the new file imagelarge.js.
The problem that does not work on my site, I have the image that becomes my mouse in the zoom.

Make a test on my website: www.media-discount.fr

Thank you to you

Hello-

Do you have friendly URLs enabled in your site? If so, see this posting:

http://www.prestashop.com/forums/viewthread/10833/P75/#116266