Google Maps and jQuery – calculating distance between two points
It has been a long time since I wrote my last example, but I've been really busy. Lately I got a request to write an example about calculating the distance between two points using KML file. What I will show you in this example is how to provide an user two drop down fields, which will be build according to provided KML file. Choosing each field will show a marker on the map. Changing the drop down field will cause removal of an according marker and placement of it in a new location. Also the markers will have two different colors, so an user can differentiate between starting and ending point. As the last functionality we will add a button. After an user clicks on the button, our function will calculate the rout and display the distance in kilometers. Let's start with a simple class which we will use to display drop down field and retrieve the coordination of requested place.
jQuery drop down – loading content according to option
It was a really busy day for me today, so I came up with a simple code for displaying content according to the option our user chooses from drop down list. What we will try to accomplish is to provide a user a drop down list and load content from a remote PHP file using AJAX request. Additionally we will filter the data and display only the content relevant to the chosen option. We will also make use of chainability of jQuery and add a nice fade in effect after the text is loaded.
Simple drop down menu with jQuery
I recently was looking at the online documentation of jQuery and I've found a really nice event listener, which helps you to provide interaction with the user. I'm writing about it, because couple weeks ago I've found myself trying to provide a drop down menu using jQuery. I was playing around with mouseover and mouseout effects, but I couldn't really find the right way to display my drop down menus. The solution is simpler than I thought. Here is how I've done that.