Mapping: Click on a marker, show content next to the map?

Question

I am kind of newbie in geocoding, so I hope you can give me some hints how to get the following:

I want to make a map with D3 or leaflet that has some marker on it. If you click on a marker, information should pop up/be shown right next to the map. Kind of like in this example: http://www.washingtonpost.com/wp-srv/special/local/14th-street-businesses/

How can I accomplish this?

I guess there are 3 components involved. I need help with 2 of them.

1. The map: I can do that
2. Some kind of ajax, because I don't want the page to be loaded, if you click on a marker - right?
3. Some kind of jquery/javascript that opens on the righthand side if I click on a marker - right?

Plus: If you know any tutorials, case studies etc. that deal with this kind of task, please let me know.

Thanks!

Answer 1

I accomplished my goal by combining leaflet and jquery following this tutorial and extending it http://palewi.re/posts/2012/03/26/leaflet-recipe-hover-events-features-and-polygons/

Answer 2

Or maybe this http://leafletjs.com/examples/choropleth.html ? It's similar to what you are asking with few adjustments. You should play with the css to make it right for you. Instead of the numeric values of the example you can enter anything you want(images, html code etc)