<form id="form1" runat="server">
<div>
<p id="demo">get location</p>
<a href ="#" id="get_location">Get Location</a>
<div id="map">
<iframe id="google_map" width="700" height="350" src="https://maps.google.com.np?output=embed"></iframe>
</div>
<script>
var x = document.getElementById("demo");
var c = function (pos) {
var latitude = pos.coords.latitude;
var longitude = pos.coords.longitude;
coords = latitude + ',' + longitude;
var locality = pos.coords.locality;
document.getElementById('google_map').setAttribute('src', 'https://maps.google.com.np/?q=' + coords + '&z=15&output=embed');
x.innerHTML = "lat:" + latitude + "<br /> long: " + longitude + "<br /> locality:" + locality;
}
document.getElementById('get_location').onclick = function () {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(c);
return false;
} else {
alert("Geo Location is not supported on your current browser!");
}
}
</script>
</div>
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:HiddenField ID="HiddenField2" runat="server" />
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click1" OnClientClick="ac()" />
<asp:TextBox ID="HiddenOffsetBox" runat="server" Visible="true" Text ="<%# latitude %>" ></asp:TextBox>
</form>