How to resize image diagonally using javascript andrey понедельник, 18 августа 2014 г. No Comment

In general we don't like to see our images stretched in view. In this case, If we want to reduce size diagonally, what should we do?

We can do it by changing width property of image.

• First We need to get original width of image using javascript's naturalWidth property. 
• Then Multiply it with 0.5 to get 50% reduced image.
• If you want 2x larger image, then multiply it with 2. like this below code,

domElement.width = doemElement.naturalWidth * 0.5;

• Then assign resultant number to image width.

Still you have doubt??? see this below DEMO. It will make you understand what I'm saying.

Related Post : HTML DOM Image naturalWidth, naturalHeight Property

In general we don't like to see our images stretched in view. In this case, If we want to reduce size diagonally, what should we do?

We can do it by changing width property of image.

• First We need to get original width of image using javascript's naturalWidth property. 
• Then Multiply it with 0.5 to get 50% reduced image.
• If you want 2x larger image, then multiply it with 2. like this below code,

domElement.width = doemElement.naturalWidth * 0.5;

• Then assign resultant number to image width.

Still you have doubt??? see this below DEMO. It will make you understand what I'm saying.

Related Post : HTML DOM Image naturalWidth, naturalHeight Property

Tweet

by Jillur Rahman

Jillur Rahman is a Web designers. He enjoys to make blogger templates. He always try to make modern and 3D looking Templates. You can by his templates from Themeforest.

Follow him @ Twitter | Facebook | Google Plus

Tags: Без рубрики