Preview af images før upload
Jeg forsøger at lave et preview af images før upload, og har søgt vidt og bredt, men har ikke fundet noget der fungere.For mig ser det ud til at man ikke kan vise billeder der ligger lokalt, ligesom je også kan forstå at et evt. preview kun vil virke i IE (Vist noget med sikkerhedsbrist).
Jeg har bl.a. nedenstående kode fundet her på siden.
Er der noen der kan hjælpe med en løsning.
<SCRIPT>
var maxWidth = 100;
var maxHeight = 100;
var fileTypes = ["bmp","gif","png","jpg","jpeg"];
var defaultPic = "spacer.gif";
var pics = new Array();
function preview(what){
var source = what.value;
var ext = source.substring(source.lastIndexOf(".") + 1, source.length).toLowerCase();
for (var i = 0; i < fileTypes.length; i++) {
if (fileTypes[i] == ext) {
break;
}
}
pics[what.id] = new Image();
if (i < fileTypes.length) {
pics[what.id].src = source;
} else {
pics[what.id].src = defaultPic;
alert("THAT IS NOT A VALID IMAGE\\nPlease load an image with an extention of one of the following:\\n\\n"+fileTypes.join(", "));
}
setTimeout("applyChanges('" + what.id + "')",200);
}
function applyChanges(id){
var field = document.getElementById(id + "_preview");
var pic = pics[id];
var x = parseInt(pic.width);
var y = parseInt(pic.height);
if (x > maxWidth) {
y *= maxWidth/x;
x = maxWidth;
}
if (y > maxHeight) {
x *= maxHeight/y;
y = maxHeight;
}
field.style.display = (x < 1 || y < 1) ? "none" : "";
field.src = pic.src;
field.width = x;
field.height = y;
}
</SCRIPT>
</HEAD>
<BODY>
<input type="file" id="pic1" onchange="preview(this)"><BR>
<img id="pic1_preview" src="spacer.gif">
<BR>
<input type="file" id="pic2" onchange="preview(this)"><BR>
<img id="pic2_preview" src="spacer.gif">
</BODY>
</HTML>
