Leaflet.js with Floating DIVs and onclick()

10 Dec
My simple Map Website

My simple Map Website

I am not a web designer, I make maps. I thought it might be cool to make a website that’s a map. I started by disabling the scrolling and zooming on leaflet. But that’s boring, all you get is an image with popups. Most people wouldn’t think it was a real map. so what I did was place some icons in <div>’s and float them on my map. When you click one, I change the map.setView() and add a marker and openPopup. This is a very simple example just to test how a map website might work. It is a single page – haven’t thought about how to display large amounts of information ad I have no need for that yet. Works great on iPhone too. Here is the live site.

CTRL-U in Firefox to see the code.

Advertisements

2 Responses to “Leaflet.js with Floating DIVs and onclick()”

  1. dw75david October 23, 2013 at 10:48 am #

    Hello, unless the site is just temporarily down the above link to the live site no longer works 😦 Is there another link available to see this map…

    • paulcrickard October 23, 2013 at 2:33 pm #

      Sorry, the site is down for good. It existed solely as a place for blog examples and no longer seemed worth keeping up.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: