Embedding Panoramio in your site

Some people have asked in the forum for a way to have Panoramio on
their site. So I went for an easier solution for all of you. I just
cooked a mini panoramio version, ready to be used on iframes outside
Panoramio. An example is:



This is what you need to write in your site:

<iframe src="http://www.panoramio.com/plugin.php?
lt=43.406295&amp;ln=-2.686586&amp;z=3&amp;k=1" width="446px" height="300px"></iframe>

You must pass these options as you will do for a GET request, and the
name of these options is lt (for latitude), ln (for longitude), k (for
kind of map, 0 = map, 1 = satellite, 2 = hybrid), z (for zoom level, 0
is the maximum zoom, 17 is the minimum), zm = 1 to activate the zoom with the mouse wheel and user (for the user email).
All of these options are optional.

You can of course tweak the size of this frame using its width and/or
height attributes.

I will improve this mini Panoramio over time, specially so it can show
pictures at a decent size.

onload event

You can use the onload event on images to know when the browser has finished the download of an image.

I have used it for the upcoming version of Panoramio, where I only show the images after they have been fully loaded.

There is however a subtle difference between Internet Explorer and Firefox related to this event.

If you set up the handler to this event after setting the src of the image and the image is in the cache, Internet Explorer will not fire the onload event.

Internet Explorer fires this event inmediatelly if the image is in the cache, so you should do:


img.onload = onLoadHandler;
img.src = "foo.png";


instead of


img.src = "foo.png";
img.onload = onLoadHandler;


or your code will not work on Internet Explorer for cached images.

More differences between Internet Explorer and the other browsers

Directly from mir.aculo.us. Internet Explorer does not like certain names for the id of your controls.

People using "tags" as id are having problems to print the page (?). Explorer also gets confused if you use "options" as id, but this time you will probably get a javascript error. To make good things better, it also has problems if you use as id the name of another control.

Another example of problem that will not be discovered with any w3c test.

Test early, test often, and with as much browsers as possible!

Hurricane Katrina

If you are (like me) not from the USA, and you want to help people affected by Katrina, you can do so through the
Blogcritics Hurricane Katrina Relief Fund.

Remember that the United States people have always been there to help us when we needed it. It is time to give
them back a little bit of help.