Please how do i get the value of \"lat\" and \"lon\" outside their function to use else where on the page.
navigator.geolocation.getCurrentPosition(handle
The first thing came my mind (at this late hour :D) is something like this:
declare a variable outside your handlers, let's say:
var coords = {};
then in your 'handle_geolocation_query' handler, trigger an event that gives you an ideea that your position is ready, assuming you're using jQuery:
$(coords).trigger('positionReady', position);
after that, everywhere you need those coordinates, listen for your custom 'positionReady' event, and do your job:
$(coords).on('positionReady', function(e, position) { console.log(position); });
This will help you to avoid 'spaghetti code', but in the same time, you need to 'think' asynchronously, and maybe using callbacks the (right) way you need.