Why would a png have right click > show picture instead of right click _ save picture as etc

The show picture option usually shows up when the image hasnt loaded, or the fix you are using has a technique that makes it do that. Also the border probably comes from the default html that applies borders to images.

Try:
img {border:none;}
a img {border:none;}

in your css

also think about posting the picture it could help

Please post a link to what you're looking at - we can offer better assistance if we can see it, too.  Thanks, ~Ray

I am developing behind a firewall so cannot post the code/link,

In the short term I have solved it by just changed the png images to gif's and filling in a background.

However I am still curious as to why it was happening and why the png's have a different behavior(right click).  

Definitely no problem with styling borders and the images were at least partially downloaded as I could see them on the page.

FYI the javascript I am using to handle png's is  attached and also an image of how the site appear on the page.

function fixIEPNG(el, bgimgdf, sizingMethod, type, offset){
	var objs = el;
	if(!objs) return;
	if ($type(objs) != 'array') objs = [objs];
	if(!sizingMethod) sizingMethod = 'crop';
	if(!offset) offset = 0;
	var blankimg = siteurl + 'images/blank.png';
	objs.each(function(obj) {
		var bgimg = bgimgdf;
		if (obj.tagName == 'IMG') {
			//This is an image
			if (!bgimg) bgimg = obj.src;
			if (!(/\.png$/i).test(bgimg) || (/blank\.png$/i).test(bgimg)) return;
 
			obj.setStyle('height',obj.offsetHeight);
			obj.setStyle('width',obj.offsetWidth);
			obj.src = blankimg;
			obj.setStyle ('visibility', 'visible');
			obj.setStyle('filter', "progid:DXImageTransform.Microsoft.AlphaImageLoader(src="+bgimg+", sizingMethod='"+sizingMethod+"')");
		}else{
			//Background
			if (!bgimg) bgimg = obj.getStyle('backgroundImage');
			var pattern = new RegExp('url\s*[\(\"\']*([^\'\"\)]*)[\'\"\)]*');
			if ((m = pattern.exec(bgimg))) bgimg = m[1];
			if (!(/\.png$/i).test(bgimg) || (/blank\.png$/i).test(bgimg)) return;
			if (!type)
			{
				obj.setStyle('background', 'none');
				//if(!obj.getStyle('position'))
				if(obj.getStyle('position')!='absolute' && obj.getStyle('position')!='relative') {
					obj.setStyle('position', 'relative');
				}
 
				//Get all child
				var childnodes = obj.childNodes;
				for(var j=0;j<childnodes.length;j++){
					if((child = $(childnodes[j]))) {
						if(child.getStyle('position')!='absolute' && child.getStyle('position')!='relative') {
							child.setStyle('position', 'relative');
						}
						child.setStyle('z-index',2);
					}
				}
				//Create background layer:
				var bgdiv = new Element('IMG');
				bgdiv.src = blankimg;
				bgdiv.width = obj.offsetWidth - offset;
				bgdiv.height = obj.offsetHeight - offset;
				bgdiv.setStyles({
					'position': 'absolute',
					'top': 0,
					'left': 0
				});
 
				bgdiv.className = 'TransBG';
 
				bgdiv.setStyle('filter', "progid:DXImageTransform.Microsoft.AlphaImageLoader(src="+bgimg+", sizingMethod='"+sizingMethod+"')");
				bgdiv.inject(obj, 'top');
				//alert(obj.innerHTML + '\n' + bgdiv.innerHTML);
			} else {
				obj.setStyle('filter', "progid:DXImageTransform.Microsoft.AlphaImageLoader(src="+bgimg+", sizingMethod='"+sizingMethod+"')");
			}
		}
	}.bind(this));
 
}

Select allOpen in new window

HomePage.gif

@janinel: Couple of things... First, is this an issue in every browser?  And second, use the "request attention" button above and ask a moderator to put this over in the Javascript Zone, too.  There is a really robust community of Experts there!

Best regards, ~Ray

Thanks Ray

- the browser is the root of the problem  - this is IE6 only

This reminds me a little of that story about the guy who goes to the doctor.  He says, "Doctor, it hurts when I do this."  Doctor says, "Don't do that!"

Don't use IE6.  I know that's not a very good response ;-(

Cross-browser stuff is a nuisance, and IE6 is a real nuisance.  I hope the JS community can help.  Sorry I don't have a ready answer for you. ~Ray

This appears to be the best advice.

Hmm... That's odd - I use png all the time and have never had any problem with IE6. I think there may still be an issue that is not relate to the png.  If anybody can post an example of a straight <img tag that replicates this issue, I would love to see it.

In any case, good luck with your project, ~Ray