Page 1 of 1
image resize help
Posted: Tue 08 May 2012 6:25 pm
by robynfali
Hi all!!
I have been messing about with my mobile sites, putting a link in for my webcam image, but i want to take it a little further.
I have the iphone one
http://valley-weather.co.uk/mobile/index.html#_home
and the android one
http://valley-weather.co.uk/android/
What i would like to do, is to put a scale down image into both of these, that could possibly be clickable so that they can view it full (mobile) screen.
I have done a bit of a search, but all I am finding is lectures on why not to do it!, i don't want to have to process a 2nd image purely for mobile because as far as I can see yawcam doesn't allow a 2nd instance using the same camera.
So basically all i am after is how you scale the image using html, and also possibly a suggestion on what size to rescale it to. Aiming at android & iphones?
Thanks in advance
Re: image resize help
Posted: Tue 08 May 2012 6:43 pm
by nitrx
Well you can put the image in a html page and resize it with the height and widht tags
http://valley-weather.co.uk/images/webcam.jpg is 640 by 480 pixels if you use the html code
<img src="
http://valley-weather.co.uk/images/webcam.jpg" width=320 height=240></img> the image wil be the half
http://www.htmlcodetutorial.com/images/_IMG_WIDTH.html some examples but you should use the tags in a html page
by example
<html>
<body>
<img src="
http://valley-weather.co.uk/images/webcam.jpg" width=320 height=240></img>
</body>
</html>
You can adjust the values width and height but it's better to keep the dimensions the same.
will do , perhaps there are alternative solutions this is a simple way of resizing for displaying in a webpage, the pageload wil be the same for the visitor of the page there is not a smaller image loaded to the adroid phone or tablet.
Re: image resize help
Posted: Tue 08 May 2012 8:14 pm
by robynfali
Thanks mate, having a mess about with it now
Re: image resize help
Posted: Tue 08 May 2012 9:15 pm
by mcrossley
Rob, that will work but the reason for the lectures is that does not alter the size of the file that has to be downloaded. To do a 'proper job' then the image could be resized on our server using PHP. Then a small thumbnail is downloaded to the phone, and only if the user elects to zoom it up in size would the full size image be downloaded.
How to implement that I defer to the PHP experts.
Re: image resize help
Posted: Tue 08 May 2012 9:38 pm
by robynfali
I do realise the proper way is to resize the image, but i do wonder how long it would take to download a 640x480 over 3g these days? I don't have PHP running on mine at the moment. Paul graciously helped me last year to do a complete php thing, then i fell onto Jacques templates which are just about my level of understanding
Re: image resize help
Posted: Wed 09 May 2012 3:56 pm
by gemini06720
mcrossley wrote:How to implement that I defer to the PHP experts.
Mark, the best way to create thumbnail image (as the thumbnail will have a smaller size than a shrunk down image using the 'width/height' parameters) is to use either a PHP script or a PHP class - some of the scripts available can even create 'on-the-fly' thumbnails...
I am using such as script to create an animated image of the radar screens - at the bottom of the left-hand menus on all of my [link removed] pages.
Re: image resize help
Posted: Sun 20 May 2012 3:24 am
by TNETWeather
If your webhost has it, you can use Imagemagick to resize an image.
Like:
Code: Select all
convert original_image.jpg -resize 25% new_image.png
Reduces the size by 25%... Note that it also changed the image format from jpg to png which works better for smaller images (less lossy look).
You can give it exact dimension sizes as well. like:
Code: Select all
convert original_image.jpg -resize 120x120 new_image.png
If you don't have that, chances are your PHP has GD built in. There are lots of scripts you can use to then do the same thing all within PHP.
I use convert a ton... for everything from NOAA images, to converting 720x1280 images for Droid Splash Screens into reasonable size thumbnails.
Re: image resize help
Posted: Mon 21 May 2012 11:27 am
by ronstrong
Why an android page when the 'iphone' one works great on android?
Could I have a copy of your template?
I;d just use the tags to resize
thanks
ron
Ron
http://www.chapelallerton.org/weather/
Re: image resize help
Posted: Mon 21 May 2012 4:36 pm
by robynfali
Gives people a choice on information all on one page, or more information on a few pages, if you want the iphone template, go to the Wiki and search for ICumulus for iPhone
