So, the title isn't great because I'm not quite sure how to explain what I'm after.  I haven't DONE any web coding at all since about 2009, and that was just fairly basic HTML/CSS and a little JS, most of which I forgot SOON after.  Other than a few simple edits, I then didn't touch web design whatsoever until a few weeks ago when I started doing some bits and bobs on Codecademy - great site by the WAY, I would highly recommend it to anyone who either hasn't done web code before or who is as rusty as I was.

Anyway!  The thing is, I'm still plugging away with Codecademy, but there's a specific project I want to do.  I've Googled it of course but there's actually too much info for me to easily digest so I thought I'd throw this question out there in the HOPES that someone can maybe recommend a straightforward way to do this.  I'm happy to learn as I go, in fact even if it was possible I'd prefer not to just have a drop-in solution so that I can learn how it works, but I don't really want to piece this together from a hundred different sources because I don't have the energy right now.

Basically, what I want to do is have a map, let's say a map of the UK.  This would obviously be an image.  I'd then like to be able to click areas, let's say each county, to then give me a number of options to pick, let's say towns or cities.  Clicking on those then takes me to a new page with information on.

I understand I probably want to use an image map, but that's about as far as I go, I don't know how to use one or anything of the sort.

So, if anyone could point me in the direction of some good resources on this, that would be hugely appreciated if there's anything I've missed out, let me know and I'll provide more details.Mapedit will be a life saver for this. I used Mapedit which came with a book back in the late 1990s and it is awesome!! I have used the fully functional trial version of it to map out areas of an image with mapped X,Y areas on them for custom navigation bars that are mapped images and this program is SWEET!

Its as easy as selecting the webpage and image you will be mapping and then selecting areas within the image and cropping areas for it to on the fly add the HTML mapping instructions into your original HTML file. When your done and you go back in you can see the added mapping and can tweak it manually if needed. You can also add mouse over info etc.

If you like it you should buy it, but here it is its functional for a specific number of uses and then the trial runs out. It might be 10 different launches of it. If you leave it running and then select more than 1 HTML to edit you can go through a number of pages and add mappings. Upon closing program and launching it again it will tell you how many uses you have left before it no longer works for trial.

http://www.boutell.com/mapedit/Ideally you'd be best to use a proper mapping system with an API such as OpenStreetMap but I presume this is a learning project so you want to work out how to do it yourself?

At a rough thought the way I would do it would be to write some Javascript (most likely using jQuery) that gets the position of the mouse relative to the image when the image is clicked (e.g. the x and y coordinates of the click from one corner of the image) - You could then have some sort of array in memory that stores the coordinates of a clickable area and then next to that stores data about what would happen when you click on that area (e.g. a list of cities).  You would then write some Javascript that handles this and displays the prompts.

Alternatively you could use CSS to float some clear DIVs over the image in the areas that you want to be clickable, you could then set up some Javascript that handles the clicks on these DIVs.It's possible that I've made this sound more complex than it is, apologies - it doesn't need to be an accurate map, it's more for informational purposes.  So, imagine a page where you click on an area of the map, you're presented with a list of some towns and cities in that area (I'd set these...somewhere...it doesn't need to get these from the internet or anything as I only want to list a few locations) and then these towns/cities are just standard links to another page.  It's basically an informational page so that I can present someone with this site and they can click on, say, Yorkshire, and see the areas or cities of interest that I've written a page of info on.  Nothing that hasn't been done before but it's relevant to a friend's interests and I thought it'd make a little project for me, too.

So, I don't think I'm looking to hook into an API or something because that's probably way too advanced for this simple project, but the whole Jquery to get a position and then an array sounds interesting, possibly a little above my current knowledge but it would be a good thing to learn, so I'll probably look into that some more.

Thanks for the info guys, you've given me some direction for my research apologies for my extreme newbiness in this, as I say I am just massively rusty.