Image does NOT print in IE 8

[PHP-Point-Of-Sale]

I attempted to print an image map created with imagemapster and it does not print at all in IE 8. It shows up in the print preview, but then shows up as blank when actually printing...Any ideas?

[jamietre]

Probably has to do with the layers. After binding with ImageMapster the topmost layer has opacity: 0, it sounds as if this baffles IE when printing. There is no reason it shouldn't work (I mean, if you can see it, it should print) but IE8 has a lot of issues of course.

I tried to get around this by intervening in a print (e.g. add a "print" button) and hiding the image map, then show it again after the print is done. (ImageMapster makes a copy of the image - so this would leave just the copy and the effects, not the hidden original image)

http://jsfiddle.net/LBEWu/

I just tried this and it does print the image in IE8. However it does not print any of the VML effects so not sure if this solves your problem.

It may just be that VML doesn't print at all. When I just do a regular "print preview" (not using the print link I created) it still doesn't show any of the VML effects either.

[PHP-Point-Of-Sale]

It didn't seem to work for me:

The part I don't understand is:
jQuery("#map").parent().bind('mouseover.print',function()
{
jQuery("#map").css('display','block');
jQuery("#map").parent().unbind('mouseover.print');
});

I already had a print button, here is what I did:

jQuery(".print_button").click(function()
{
    jQuery("#map").parent().bind('mouseover.print',function() 
    {
        jQuery("#map").css('display','block');
        jQuery("#map").parent().unbind('mouseover.print');
    });
    jQuery("#map").css('display','none');
    window.print();
    return false;   
});

[jamietre]

That's used to detect when the print dialog closes so I can put things back to the way they were before. Since there's no built-in way to know when the user is done printing, I just added a mousemove handler to the wrapper, and then clean up when that happens by restoring the "display" css of the image and removing the handler.

The code looks good, what happens when you print? Do you see the image at all? Just so I am sure what the problem is, are you seeing nothing at all when you print, or are you just not seeing the effects as a result of something being selected?

[PHP-Point-Of-Sale]

It works actually, I just wish the highlights would show up :(

[jamietre]

You might try some other approaches. If IE8 just can't print VML, then you're stuck, but if it's something with the css and layers with imagemapster, then you could try copying all the VML into another div and hiding the ImageMapster one entirely.

e.g.

var wrap = $("#map").parent();
// create a new div with a copy of everything in the imagemapster wrapper *except* the hidden image
var newDiv = $('<div></div>').append(wrap.children().clone().remove('#map'));

wrap.after(newDiv);  
wrap.hide();
newDiv.show();

... then remove newDiv & show wrap again in that callback function when the print is done. Might make a difference. If not I'm guessing IE8 just can't print VML markup.

[jamietre]

Any luck with this? I would like to close the issue either as resolved or "no known solution". I don't think this is a bug with imagemapster.

[PHP-Point-Of-Sale]

You can close

Chris Muench
Sent from my iPhone

On Jun 21, 2012, at 7:52 AM, James Treworgy
reply@reply.github.com
wrote:

Any luck with this? I would like to close the issue either as resolved or "no known solution". I don't think this is a bug with imagemapster.

---

Reply to this email directly or view it on GitHub:
#49 (comment)