Reputation: 328
Hi I'm trying to use/add the free map tools which I found on this site http://www.freemaptools.com/how-far-is-it-between.htm to my current websites which are a list of tools that are commonly used by our staff, I was planning to embbed it, however it doesn't seem to have that kind of feature, and I am asking you guys if you can offer me an alternative to the task that I want to do. While doing this "ToolBox" I am also willing to make my own map tools that measures the distance between countries. If you can kindly guide me. Thank you. Here's what I've got so far
Code:
<form name="inp">
<table align="center" width="95%" border="0">
<tbody><tr>
<td width="30"></td>
<td align="right">City, Country</td>
<td></td>
<td>City, Country</td>
<td width="30"></td>
</tr>
<tr>
<td width="30"></td>
<td width="269" align="right">From
<input name="pointa" type="text" value="" size="22" onkeypress="autocompletea(this.value, event)"></td>
<td width="34"><div align="center">to</div></td>
<td width="271"><input name="pointb" type="text" value="" size="22" onkeypress="autocompleteb(this.value, event)"> <input name="show" type="button" value="Show" onclick="findaandb(document.forms['inp']['pointa'].value,document.forms['inp']['pointb'].value);">
<label></label></td>
<td width="30"></td>
</tr>
<tr>
<td colspan="2">
<div id="autocompletediva" class="autocomp" style="display: block; visibility: hidden; height: 0px; width: 0px;"></div>
</td>
<td></td>
<td colspan="2">
<div id="autocompletedivb" class="autocomp" style="display: block; visibility: hidden; height: 0px; width: 0px;"></div></td>
</tr>
<tr>
<td colspan="5"><div id="msg" class="msg"> </div></td>
</tr>
<tr>
<td colspan="5" align="center"> Measure in :
<input name="dist" type="radio" onclick="toggleUnits('MILES');" checked="CHECKED">
<font face="verdana, geneva, helvetica" size="2">miles<input type="radio" name="dist" onclick="toggleUnits('KMS');">
km</font>
</td>
</tr>
<tr><td colspan="5" align="center"><strong>Distance as the Crow Flies </strong> :
<input style="display: inline;" id="distance" type="text" size="10" value="0.000" readonly="true">
<img src="" alt="As the crow Flies"> </td>
</tr>
<tr>
<td colspan="5" align="center"><strong>Distance by Land Transport</strong> :
<input style="display: inline;" id="transport" type="text" size="10" value="0.000" readonly="true">
<img src="" alt="Land Transport">
</td>
</tr>
</tbody></table>
</form>
Upvotes: 0
Views: 144
Reputation: 839
I think you're missing the javascript part
onkeypress="autocompletea(this.value, event)"
onclick="toggleUnits('KMS');"
onclick="toggleUnits('MILES');"
These are all javascript function calls, but what you posted is only the HTML part. Quickly reviewing the web page you posted i think that at least you're missing the following JS file. http://www.freemaptools.com/script/how-far-is-it-between.js
Although i think that if you are missing this, may be because it is your first time you are creating a web page,HTML is only the layout and JavaScript enables you to "dynamize" the HTML (well, i think that many will disagree but it's kind of).
I recommend you to have a look at a JavaScript tutorial, i don't remeber any good right now, but sure that if you google for you will find many good tutorials around there.
Hope helped
Upvotes: 2
Reputation: 1516
You can try "Iframe" or Jquery "load" function.
Here are some examples
http://www.w3schools.com/jquery/jquery_ajax_load.asp
http://www.w3schools.com/tags/tag_iframe.asp
Hope this helps....
Upvotes: 1