Display locations from a database on a map using Google Maps JavaScript API and PHP

In this relatively short blog post we'll use PHP/MySQL and Google Maps Javascript API to display locations from a MySQL database on a map.

We'll make a simple "City guide to Zagreb", meaning we'll select interesting locations from the database, display them on a map, show some info about them and show directions from user's current position to a location of his/her choice.

What you'll need

  • PHP/MySQL Development Environment
  • Some understanding of JavaScript
  • Some free time

As you can see it's really easy to get started. So, let's do it!


Create animated menu with CSS Sprites and jQuery

In this blog post we'll create a simple Animated Menu using CSS Sprites & jQuery. Some of you might remember the times when you needed to download custom javascript scripts designed just for a certain type of menu. Nowdays you can very easily create your own custom menus. Let's see how.

Nothing really special, but can easily be extended to meet your needs. Also, I decided to use background-position animations because it's not that common to find them online. And they're certainly not common like fade-type animations.


Create a simple AJAX based contact form

Let’s return to Web Development Category and create a Simple Contact Form™! But, just to make things interesting we’ll submit the form using AJAX, so the user gets the feedback without the page refresh. Also, let’s log the User Input into Database for later reviewing.

Here’s a screenshot of our form: