Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to find the base64 image width and height

How to find the base64 image width and height

<img id="thumb0" width="200" height="200" 
src="data:image/png;base64, ................">

Image property width and height are constant as i need to show them as thumb nail, but where as the original image properties are different.

I need to get the original image height and width.

Suppose my original image height and width are 750 X 500

I tried like this but getting the property width and height

$("#thumb0").width();

value is 200.

Please help how to get orginal width and height of the image.

like image 858
vvr02 Avatar asked Jan 11 '13 09:01

vvr02


People also ask

How can I get Base64 image size?

Base64 encodes 3 bytes of binary data on 4 characters. So to get the size of the original data, you juste have to multiply the stringLength (minus the header) by 3/4.

Is Base64 smaller than image?

base64 encoding makes file sizes roughly 33% larger than their original binary representations, which means more data down the wire (this might be exceptionally painful on mobile networks) data URIs aren't supported on IE6 or IE7.

What is Base64 image format?

Base64 encoding is a way to encode binary data in ASCII text. It's primarily used to store or transfer images, audio files, and other media online. It is also often used when there are limitations on the characters that can be used in a filename for various reasons.

How do you find the width of an image in HTML?

Answer: Use the HTML5 naturalWidth and naturalHeight You can easily find the original or intrinsic width and heigh of an image using the HTML5 image naturalWidth and naturalHeight properties.


1 Answers

You can build another image element and get its size :

var img = new Image();
img.src = $('#thumb0').attr('src');
var originalWidth = img.width;
like image 138
Denys Séguret Avatar answered Oct 05 '22 12:10

Denys Séguret