OK, it seems that IE doesn’t like the javascript:void(0); being in the href attribute of the link, so do the following:
Edit snippet code and replace (line 824):
$link="<a href=\"javascript:void(0);\" onClick=\"javascript:openWindow('[(site_url)]".$file."','".htmlentities(stripslashes($pic['title']),ENT_QUOTES,$mgconfig['use_charset'])."',".$window_height.",".$window_width.",'gallery');\">";
with:
$link="<a href=\"#\" onClick=\"javascript:openWindow('[(site_url)]".$file."','".htmlentities(stripslashes($pic['title']),ENT_QUOTES,$mgconfig['use_charset'])."',".$window_height.",".$window_width.",'gallery');\">";
The downside of this is that when # is used as the link url, some browsers allways scroll to the top of the page. I was using the javascript:void(0) to go around this in the popup script, what works in IE6 too, but not the background changing.. Weird. And to be even more weirder, if you put alert() to the last line of your modified popup.js function, the backgrounds will change in IE too.
Anyone encountered this before or know some way to "force" the image/element repaint in IE via javascript?
If you want to have the images to change on mouse hover, change the line to:
$link="<a href=\"javascript:void(0);\" onMouseOver=\"javascript:openWindow('[(site_url)]".$file."','".htmlentities(stripslashes($pic['title']),ENT_QUOTES,$mgconfig['use_charset'])."',".$window_height.",".$window_width.",'gallery');\">";
And if you want to pass the picture description to the js function too (to then place somewhere on the page via innerHtml, use:
$link="<a href=\"javascript:void(0);\" onMouseOver=\"javascript:openWindow('[(site_url)]".$file."','".htmlentities(stripslashes($pic['title']),ENT_QUOTES,$mgconfig['use_charset'])."','".htmlentities(stripslashes($pic['descr']),ENT_QUOTES,$mgconfig['use_charset'])."',".$window_height.",".$window_width.",'gallery');\">";
And change the popup.js to:
function openWindow(url, title, descr, height, width, name, parms) {
var picHolder = document.getElementById('picHolder');
picHolder.style.backgroundImage="url("+url+")";
}
To have the picture title and description showing up somewhere via js, you could do a divs for them first like:
<div id="picTitle"></div>
<div id="picDescr"></div>
Then add following javascript to the popup.js function:
var picTitle = document.getElementById('picTitle');
picTitle.innerHTML = title;
var picDescr = document.getElementById('picDescr');
picDescr.innerHTML = descr;
!