resize billede med ondrag
Hej!Jeg har lidt bøvl med scriptet herunder, der skal sørge for at man kan skalere et billede og fortsat holde proportionerne.
Det går fint så længe man gør billedet mindre, men det ser sjovt ud når det bliver større :)
Hvis du vil teste skal du angive stien til et billede da det ikke vil fungere hvis billedet ikke findes.
På forhånd tak :)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script type="text/javascript">
iBeReady = false;
function dragResizeImage(dragEvent,which){
if (iBeReady){
str = which.split('img_');
str1 = str[1].split('_');
bredde = str1[0];
hoejde = str1[1];
ny_bredde = document.getElementById(which).width;
if(ny_bredde > bredde) {
document.getElementById(which).width = bredde;
return false;
}
division = bredde/hoejde;
ny_hoejde = bredde * division;
posX = document.getElementById(which).offsetLeft;
posY = document.getElementById(which).offsetTop;
newXsize = dragEvent.x;
newXsize = newXsize - posX;
document.getElementById(which).width=newXsize;
document.getElementById(which).height=newXsize / division;
}
}
function clickResetImageSize(which){
if (iBeReady){
str = which.split('img_');
str1 = str[1].split('_');
bredde = str1[0];
hoejde = str1[1];
document.getElementById(which).width=bredde;
document.getElementById(which).height=hoejde;
}
}
</script>
</head>
<body onload="iBeReady=true;">
<img ondrag="dragResizeImage(event,this.id)" onclick="clickResetImageSize(this.id)" id="img_500_584_line" src="cm3/cms/filarkiv/line.jpg" width="500" height="584" alt="" border="0">
</body>
</html>
