how i get uploaded image height and width,for display in it's original size.
2
-
can you elaborate on "uploaded image"? I'm confused why javascript is coming in to play when this appears more like a server-side functionality.Brad Christie– Brad Christie2011-01-27 19:24:02 +00:00Commented Jan 27, 2011 at 19:24
-
First of all thank you Brad.Actually i uploaded images on server.And i m creating photogallery,for that i created thumbnail of these images when user click on thumbnail light box open.So i have to vary size of lightbox according to original uploaded image size.THIS THING I CANN'T MANAGE.sandip– sandip2011-01-30 07:16:08 +00:00Commented Jan 30, 2011 at 7:16
Add a comment
|
6 Answers
Keeping in mind what Brad said (this appears to be server-side functionality), You can use this php code, but you should verify first that the uploaded file really is an image.
list($w, $h) = getimagesize($_FILES['yourUploadedFieldName']);
// $w holds the numeric width
// $h holds the numeric height
Comments
In a case of client-size, you can use the following:
;(function($){
$.imageSize = function(imgUrl,callback){
var img = $('<img>').attr('src',imgUrl).css('display','none').appendTo('body');
img.load(function(){
var call = callback || function(i,w,h){};
call(imgUrl,$(this).width(),$(this).height());
});
};
})(jQuery);
(jQuery plugin) You can't get the image size until it's been loaded, but if you load it up in the background and wait for it, you'll be able to access the information. e.g.
$.imageSize('http://www.nasa.gov/images/content/511786main_image_1848_946-710.jpg',function(i,w,h){
alert(i+'\r\n'+w+'x'+h);
});
Comments
getimagesize should do the trick, check this out for more documentation http://php.net/manual/en/function.getimagesize.php
Comments
If you use the Prototype Javascript library:
var img = new Element(
'img', {
src: 'image.jpg'
}
);
img.observe(
'load',
function(event) {
alert(
Event.element(event).getWidth() +
'x' +
Event.element(event).getHeight()
);
}
);
$$('body').first().appendChild(img);
img.remove();
Comments
The image will render in its 'natural' size if the img tag has no width and height attribute and the css does not define style width and height for it.
Comments
If you dont specify a height and width the img tag will display an image in its correct size
the following will display mypic.jpg full size
<img src='mypic.jpg' >
or this will display the image with width 200px and height in ratio
<img src='mypic.jpg' width="200px" >
