调整大小，使用javascript从中心裁剪图像

Question

Wonder if anyone can help, I'm looking for a way to take an image path which will be varying sizes - and then create a fixed height and width thumbnail (136x75) from that, cropping from the center point.

I can't really do this in PHP as I need to do this on the fly in the js because Im reading a xml file which contains the image paths, and loading them in via javascript.

I'm just trying to find a script or build one, which will figure out weather to size to the width or height (depending on landscape or portrait ratio of orginal image?) and then crop from the center to the final 136x75

Anyone got any good suggestions on how to do this, or an existing solution ?

Thanks for looking,

Answer 1

use the css clip style

CSS Clip

EDIT: The wrapper part of the code it shows should prevent absolute positioning malfunctions

<div class="clipwrapper"> <--- this gets set to position:relative so it shouldnt break the image out of the carosel
    <div class="clip"> <--- this gets the absolute position 
     <img src="castle.jpg" />
    </div>
</div>