Image Handler 2 (for ZC v1.3.8 ONLY) Support

[BlessIsaacola]

...and now I have a new fun issue.

Would anyone know why, in IE7 (haven't checked 6 yet) when you hover over a product image on the "List Products" page the "popup" shows up *only* in the original viewable area of the screen?

Meaning, if I open up the page so "View all products" is shown, and scroll all the way to the bottom of the screen to the last product - if I hover my mouse over the image, the "popup" appears out of view, all the way at the top where the original viewable area is.

The site went live yesterday, but I don't know if I have permission to post the URL in a support forum, so to assist in keeping it from being found, I'll say the URL is (get your brains ready for a puzzle!) Natalie - you want the first 4 letters, and add an "s" to the end...and Photographer, you want the first 5 letters, and add an "s" to the end. Smoosh them together as one word, and add on dot COM. Go to any product page in IE7 and open it up to "View All" - scroll down and you'll see what I mean. The little popups only want to show in the orginal viewable area.

Anyone have any ideas on this? (running 1.3.7)

Oh yeah, and why to the little "hotzone" plus size watermarks show up, when it's set to "no" for "hotzone"? If I set it to "yes, they're still there, but the popups don't work anymore.

Nice looking site! I know there is a setting that you can adjust for this problem you're describing. Unfortunately, it's buried in this very long thread so you might want to do a search. Alternatively you can go to Tim's support site to see if there is a fix for this. There are fixes posted there that are not here. The url for Tim's forum is: http://forums.breakmyzencart.com/

Best Wishes!

[Get Em Fast]

doodlebee, that's REAL close to another site (www.natsphotos.com), which is the first one I went to, as I forgot the "a" on Nata.
But, for your's, I don't really have a clue if it will work, but I noticed that your jscript_imagehover.js is quit different than mine, and I have had no problems of this nature on my site. So, what the hey......it's worth a shot, to try my version, and it will only take you a couple of seconds to copy, paste, save, clear the browser cache, and check it out.
Just don't forget to back yours up first! Here's what mine looks like, and as I said, they have quit a few differences:

/*
Simple Image Trail script- By JavaScriptKit.com
Visit http://www.javascriptkit.com for this script and more
This notice must stay intact

Modified by Tim Kroeger ([email protected]) for use with
image handler 2 and better cross browser functionality
*/

var offsetfrommouse=[10,10]; //image x,y offsets from cursor position in pixels. Enter 0,0 for no offset
var displayduration=0; //duration in seconds image should remain visible. 0 for always.
var currentimageheight = 400; // maximum image size.

if (document.getElementById || document.all){
document.write('<div id="trailimageid">');
document.write('</div>');
}

function getObj(name) {
if (document.getElementById) {
this.obj = document.getElementById(name);
this.style = document.getElementById(name).style;
} else if (document.all) {
this.obj = document.all[name];
this.style = document.all[name].style;
} else if (document.layers) {
this.obj = document.layers[name];
this.style = document.layers[name];
}
}

function gettrail(){
return new getObj("trailimageid");
}

function truebody(){
return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function showtrail(imagename,title,oriwidth,oriheight,zoomimgwidth,zoomimgheight, image, startx, starty, startw, starth){
if (oriwidth > 0){ offsetfrommouse[0] = oriwidth; }
if (oriheight > 0){ offsetfrommouse[1] = -1 *(zoomimgheight-oriheight)/2 - 40; }
// alert (offsetfrommouse[0] + "," + offsetfrommouse[1]);
if (zoomimgheight > 0){ currentimageheight = zoomimgheight; }
trailobj = gettrail().obj;
trailobj.setAttribute("startx", startx);
trailobj.setAttribute("starty", starty);
trailobj.setAttribute("startw", startw);
trailobj.setAttribute("starth", starth);
trailobj.setAttribute("imagename", imagename);
trailobj.setAttribute("imgtitle", title);
document.onmousemove=followmouse;
}

function hidetrail(){
trailstyle = gettrail().style;
trailstyle.visibility = "hidden";
document.onmousemove = "";
trailstyle.left = "-500px";
trailstyle.top = "-500px";
}

function followmouse(e){

var xcoord=offsetfrommouse[0];
var ycoord=offsetfrommouse[1];

var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15;
var docheight=document.all? Math.min(truebody().scrollHeight, truebody().clientHeight) : Math.min(window.innerHeight);

//if (document.all){
// trail.obj.innerHTML = 'A = ' + truebody().scrollHeight + '<br>B = ' + truebody().clientHeight;
//} else {
// trail.obj.innerHTML = 'C = ' + document.body.offsetHeight + '<br>D = ' + window.innerHeight;
//}
var relativeX = null;
var relativeY = null;

if (typeof e != "undefined"){
if ((typeof e.layerX != "undefined") && (typeof e.layerY != "undefined")) {
relativeX = e.layerX;
relativeY = e.layerY;
} else if ((typeof e.x != "undefined") && (typeof e.y != "undefined")) {
relativeX = e.x;
relativeY = e.y;
}

if (docwidth - e.pageX < 300){
xcoord = e.pageX - xcoord - 286; // Move to the left side of the cursor
} else {
xcoord += e.pageX;
}
if (docheight - e.pageY < (currentimageheight + 0)){
ycoord += e.pageY - Math.max(0,(0 + currentimageheight + e.pageY - docheight - truebody().scrollTop));
} else {
ycoord += e.pageY;
}
} else if (typeof window.event != "undefined"){
if ((typeof event.x != "undefined") && (typeof event.y != "undefined")) {
relativeX = event.x;
relativeY = event.y;
} else if ((typeof event.offsetX != "undefined") && (event.offsetY != "undefined")) {
relativeX = event.offsetX;
relativeY = event.offsetY;
}

if (docwidth - event.clientX < 300){
xcoord = event.clientX + truebody().scrollLeft - xcoord - 286; // Move to the left side of the cursor
} else {
xcoord += truebody().scrollLeft+event.clientX;
}
if (docheight - event.clientY < (currentimageheight + 0)){
ycoord += event.clientY + truebody().scrollTop - Math.max(0,(0 + currentimageheight + event.clientY - docheight));
} else {
ycoord += truebody().scrollTop + event.clientY;
}
}

trail = gettrail();
startx = trail.obj.getAttribute("startx");
starty = trail.obj.getAttribute("starty");
startw = trail.obj.getAttribute("startw");
starth = trail.obj.getAttribute("starth");
imagename = trail.obj.getAttribute("imagename");
title = trail.obj.getAttribute("imgtitle");

// calculate and set position BEFORE switching to visible
var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15;
var docheight=document.all? Math.max(truebody().scrollHeight, truebody().clientHeight) : Math.max(document.body.offsetHeight, window.innerHeight);
if(ycoord < 0) { ycoord = ycoord*-1; }
if ((trail.style.left == "-500px") || (trail.style.left == "")) { trail.style.left=xcoord+"px"; }
if ((trail.style.top == "-500px") || (trail.style.top == "")) { trail.style.top=ycoord+"px"; }
trail.style.left=xcoord+"px";
trail.style.top=ycoord+"px";
// alert (trail.style.left+","+trail.style.top);

if (trail.style.visibility != "visible") {
if (((relativeX == null) || (relativeY == null)) ||
((relativeX >= startx) && (relativeX <= (startx + startw))
&& (relativeY >= starty) && (relativeY <= (starty + starth)))){
newHTML = '<div><h1>' + title + '</h1>';
newHTML = newHTML + '<img src="' + imagename + '"></div>';
trail.obj.innerHTML = newHTML;
trail.style.visibility="visible";
}
}
}




Hope this helps. The images show up a little farther to the right of the cursor, but if your customers can at least see them, they (and you) will be happy, right?

[kirstynm]

I've only just started to use ZenCart, so please bear with me.

I've installed IH2 and the fix so that my additional images show up at the bottom of the page like so:

http://www.sinpatiko.com/testsite2/i...&products_id=2

I just want to know if there is a quick and easy way to have these additional images presented vertically down the page beneath the larger product image, with the product info text, etc, next to it?

Any help would be much appreciated!

[Oliv]

Hi,

I don't know if i'm the only one to face this problem, haven't noticed it along this big thread.

Image Handler is regularly and randomly disactived on my ZenCart. I've find that the IH_VERSION entry in the CONFIGURATION table just disappears. Then, IH is simply disabled, and i have to "Install Image Handler" manually in the admin zone to solve the problem.

I can't explain.

My only lead is that this entry has a strange "configuration_group_id" value : 0.

Thank you for your help.

[Get Em Fast]

oliv, could it just be browser cache playing it little tricks on you?

[doodlebee]

Thanks Get 'em. Turns out the JS you saw was one I was testing with. But the one you've posted it actually the one I already ahve that's displaying this weirdness. I put it back so you could see...

I know the author of the contribtution has seen this as a bug (on his site, 3/27 - he's been trying to figure it out), so he's aware of it. But it's so *weird*. It was working fine before - I can't imagine why it's doing this now.

[webrob]

I have image handler 2 installed for my client. He was hosting at 1and1 and I convinced him to host with me. Since I have moved his site his images are a little fuzzy.

Check it out: http://www.modernhq.com

You can see the info here: http://www.modernhq.com/info.php

Can anyone see why my images look so bad?

[gilby]

I have image handler 2 installed for my client. He was hosting at 1and1 and I convinced him to host with me. Since I have moved his site his images are a little fuzzy.

Check it out: http://www.modernhq.com

You can see the info here: http://www.modernhq.com/info.php

Can anyone see why my images look so bad?

Easy you DON'T have IH2 installed, or its not working.
All the small images are the large images squashed by the browser down to a small size. Therefore the jaggies & hugh load size.
Need to reinstall IH2 or turn it on

[Fredde]

How do i use different pictures with image handler?
I know ih resize the pics but i actually want to use pictures showing different things dependig if its small, medium or large.. Large shows all color options etc..

So, how do i manage to fix this in a easy way, not having to edit every item in the shop

[webrob]

Easy you DON'T have IH2 installed, or its not working.
All the small images are the large images squashed by the browser down to a small size. Therefore the jaggies & hugh load size.
Need to reinstall IH2 or turn it on

It says in my admin that it is on.....how do I check to turn it on or disable adn re-enable without loosing all of my images?