Image Handler 2 Conflict with Scrolling Side Boxes

[CraigW]

I have found the source of the scrolling problems in sideboxes when Image Handler 2(IH2) is installed. Only affects IE 6 & IE 7, Firefox is unaffected.

It's the fact that IH2 does a " style="position:relative" " on the images in those sideboxes. Remove this CSS style and the problem is fixed.

Have a look in includes/classes/bmz_image_handler.class.php, right at the end of the file.

You will see:
return $parameters . 'style="position:relative" onmouseover="showtrail(' . "'$products_image_zoom'...

Just remove the offending style so you end up with:
return $parameters . 'onmouseover="showtrail(' . "'$products_image_zoom'...

And scrolling in sideboxes will work again.

But this breaks image hover functionality offered with Image Handler for the entire site.

We need some way of testing for whether you are actually in a sidebox or not.

I've tested this with a few scrolling sidebox contributions, all with the same results.

Has anyone got a fix or workaround for this problem? Or any suggestions for working towards a solution. Thanks.

[crabdance]

I have found the source of the scrolling problems in sideboxes when Image Handler 2(IH2) is installed. Only affects IE 6 & IE 7, Firefox is unaffected.

It's the fact that IH2 does a " style="position:relative" " on the images in those sideboxes. Remove this CSS style and the problem is fixed.

Have a look in includes/classes/bmz_image_handler.class.php, right at the end of the file.

You will see:
return $parameters . 'style="position:relative" onmouseover="showtrail(' . "'$products_image_zoom'...

Just remove the offending style so you end up with:
return $parameters . 'onmouseover="showtrail(' . "'$products_image_zoom'...

And scrolling in sideboxes will work again.

But this breaks image hover functionality offered with Image Handler for the entire site.

We need some way of testing for whether you are actually in a sidebox or not.

I've tested this with a few scrolling sidebox contributions, all with the same results.

Has anyone got a fix or workaround for this problem? Or any suggestions for working towards a solution. Thanks.

Thanks for showing this fix. I just uploaded and have IH2 working and just now noticed that IE stopped working on the scroll box. Thanks for this fix!!... everything is working smooth now!

-cd-

[RedrikShuhart]

I have found a solution that makes both features, image hover and scrolling sidebox, work perfectly fine in IE6.

1. First of all, you keep the 'style="position:relative"' in includes/classes/bmz_image_handler.class.php intact.

2. Add style="position:relative" to the marquee tag in includes/templates/YOUR_TEMPLATE/sideboxes/tpl_whats_new.php .
So you will have something like $content .= '<MARQUEE style="position:relative" behavior= " ....

3. Add the following block to your stylesheet :

#whatsnewContent{
height: 150px;
overflow: hidden;
position: relative;
}

The block name, whatsnewContent, has to match the id name of the div that's holding the content of the sidebox.

Thats it. Have fun :)

[weezee]

I have found a solution that makes both features, image hover and scrolling sidebox, work perfectly fine in IE6.

1. First of all, you keep the 'style="position:relative"' in includes/classes/bmz_image_handler.class.php intact.

2. Add style="position:relative" to the marquee tag in includes/templates/YOUR_TEMPLATE/sideboxes/tpl_whats_new.php .
So you will have something like $content .= '<MARQUEE style="position:relative" behavior= " ....

3. Add the following block to your stylesheet :

#whatsnewContent{
height: 150px;
overflow: hidden;
position: relative;
}


The block name, whatsnewContent, has to match the id name of the div that's holding the content of the sidebox.

Thats it. Have fun :)

I've tried all of this, taking out the style, and adding the $content .=' <Marquee style= position:relative" behavior= " I'm not a php programer so I do know what goes next and all I get is a parse error. when I just take out the style it still don't work.
when I take out this: return $parameters . 'style="position:relative"

I get a parse error. I take out this: return $parameters . 'style="position:relative"onmouseover="showtrail
I still get a parse error.

If I take this all out the box still don't work.
return $parameters . 'style="position:relative"onmouseover="showtrail (' . "'$products_image_zoom','$alt',$width,$height,$zoomwidth,$zoomheight,this," . $this->zoom['startx'].','.$this->zoom['starty'].','.$this->zoom['width'].','.$this->zoom['height'].');" onmouseout="hidetrail();" ';

Could someone please help. I don't know any thing to do except remove the image handle.

http://www.weezeesgifts.com

[CraigW]

RedrikShuhart, you are a legend, that's done the trick. I now have IH2 Image Hover and scrolling Featured sidebox. Just did the same code changes to Misty's featured scrollbox mod, just changing id tag name from "whatsnewContent" -> "featuredContent".

One small problem is that IE6 starts scrolling the image slightly past the bottom of my sidebox, the text doesn't appear until the correct scrolling position. IE7 & firefox start scrolling in the correct position. But hey, I can live with that.

Thanks again.

[misty]

Confirm RedrikShuhart's fix works for my scrolling featured sidebox,
with small problem, mentioned by CraigW, when using IE6

[justMARK]

I have found a solution that makes both features, image hover and scrolling sidebox, work perfectly fine in IE6.

1. First of all, you keep the 'style="position:relative"' in includes/classes/bmz_image_handler.class.php intact.

2. Add style="position:relative" to the marquee tag in includes/templates/YOUR_TEMPLATE/sideboxes/tpl_whats_new.php .
So you will have something like $content .= '<MARQUEE style="position:relative" behavior= " ....

3. Add the following block to your stylesheet :

#whatsnewContent{
height: 150px;
overflow: hidden;
position: relative;
}

The block name, whatsnewContent, has to match the id name of the div that's holding the content of the sidebox.

Thats it. Have fun :)

Hello!
Can you please be a little bit more clear?
I don't know PHP and I still try my best, but if you help... please help the LAME ONES TOO... like me. Can you provide please step by step instructions? Thank you!

[justMARK]

Ok!
I did it!
The solution to the "Image Handler 2 Conflict with Scrolling Side Boxes" problem is:
1. Go to the file includes/templates/YOUR_TEMPLATE/sideboxes/tpl_whats_new.php and replace
$content .= '<MARQUEE behavior= "' . $scroll_behaviour . '" align= "center" direction= "' . $scroll_direction . '" height="' . $box_height . '" scrollamount= "' . $scroll_amount . '" scrolldelay= "' . $scroll_delay . '" onmouseover=\'this.stop()\' onmouseout=\'this.start()\'>' . $rn .'</MARQUEE>';
with
$content .= '<MARQUEE style="position:relative" behavior= "' . $scroll_behaviour . '" align= "center" direction= "' . $scroll_direction . '" height="' . $box_height . '" scrollamount= "' . $scroll_amount . '" scrolldelay= "' . $scroll_delay . '" onmouseover=\'this.stop()\' onmouseout=\'this.start()\'>' . $rn .'</MARQUEE>';

2. Go to file includes/templates/YOUR_TEMPLATE/CSS/style_imagehover.css and add
#whatsnewContent{
height: 150px;
overflow: hidden;
position: relative;
}

And you're done!!! Mine is woking now just perfect. mainmag.net Check it!

For the author:
Thank you for the module! Is a really catchy one! Can I try and code it and upload an update for you? Or you want to do it? Thank you again!!!

Again... I am a novice... and I figured!

[eaddesigns]

Ok!
I did it!
The solution to the "Image Handler 2 Conflict with Scrolling Side Boxes" problem is:
1. Go to the file includes/templates/YOUR_TEMPLATE/sideboxes/tpl_whats_new.php and replace
$content .= '<MARQUEE behavior= "' . $scroll_behaviour . '" align= "center" direction= "' . $scroll_direction . '" height="' . $box_height . '" scrollamount= "' . $scroll_amount . '" scrolldelay= "' . $scroll_delay . '" onmouseover=\'this.stop()\' onmouseout=\'this.start()\'>' . $rn .'</MARQUEE>';
with
$content .= '<MARQUEE style="position:relative" behavior= "' . $scroll_behaviour . '" align= "center" direction= "' . $scroll_direction . '" height="' . $box_height . '" scrollamount= "' . $scroll_amount . '" scrolldelay= "' . $scroll_delay . '" onmouseover=\'this.stop()\' onmouseout=\'this.start()\'>' . $rn .'</MARQUEE>';

2. Go to file includes/templates/YOUR_TEMPLATE/CSS/style_imagehover.css and add
#whatsnewContent{
height: 150px;
overflow: hidden;
position: relative;
}

And you're done!!! Mine is woking now just perfect. mainmag.net Check it!

For the author:
Thank you for the module! Is a really catchy one! Can I try and code it and upload an update for you? Or you want to do it? Thank you again!!!

Again... I am a novice... and I figured!

thanks so much for this. It also worked for me

[shoniqua]

nevermind I was obviously a few pages behind when posting.