How to Put Your Large Pictures in Web Pages without Resizing Them


How do you embed large images in your website like some high resolution photographs, a long screenshot or a big panorama ?
Some of us would create a small thumbnail version of that image and link it to the original file. Works perfect but here's an alternate approach that lets you embed full picture of virtually any size onto web pages without resizing.
People can pan or zoom your image with the mouse just the way they navigate Google Maps. To see all this in action, here's a live example that uses one of the wide-screen Vista Wallpapers.
embed-large-picture

Here are the different step involved:
1. Download the free Google Maps Image Cutter developed at University College London.
 google-maps-cutter
2. Extract and run the Google Maps Image Cutter software. Now select any large picture on your hard drive and click the Create button.
You should now see an HTML file and numerous small images (tiles) in a sub-folder that has the same name as your original image.
vista-wallpapers
3. Go to Google Maps website and get your personal key.
4. Open the HTML file and replace the word PUTAPIKEYHERE with secret key that you generated in Step 3.
5. Upload the full folder to your website or other web storage and embed the HTML file in your web page using the IFRAME tag.
0 Comments
Disqus
Fb Comments
Comments :

0 comments:

Post a Comment