这篇博客详细分析了一段Google Map的源代码，包括地图类型定义、浏览器兼容性检查、地图加载函数以及搜索和导航功能的实现。通过源代码，读者可以深入了解Google Map的工作原理和交互机制。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<noscript>
<meta http-equiv="refresh" content="0; URL=http://maps.google.com/?output=html" />
</noscript>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script type="text/javascript"><!--
//<![CDATA[
var _mSiteName = 'Google Local';
var _mZoomIn = 'Zoom In';
var _mZoomOut = 'Zoom Out';
var _mZoomSet = 'Click to set zoom level';
var _mZoomDrag = 'Drag to zoom';
var _mPanWest = 'Go left';
var _mPanEast = 'Go right';
var _mPanNorth = 'Go up';
var _mPanSouth = 'Go down';
var _mLastResult = 'Return to the last result';
var _mGoogleCopy = '©2005 Google';
var _mDataCopy = 'Map data ©2005 ';
var _mNavteq = 'NAVTEQ™';
var _mTeleAtlas = 'Tele Atlas';
var _mZenrin = 'ZENRIN';
var _mZenrinCopy = 'Map ©2005 ';
var _mNormalMap = 'Map';
var _mNormalMapShort = 'Map';
var _mHybridMap = 'Hybrid';
var _mHybridMapShort = 'Hyb';
var _mNew = 'New!';
var _mTerms = 'Terms of Use';
var _mKeyholeMap = 'Satellite';
var _mKeyholeMapShort = 'Sat';
var _mKeyholeCopy = 'Imagery ©2005 ';
var _mScale = 'Scale at the center of the map';
var _mKilometers = 'km';
var _mMiles = 'mi';
var _mMeters = 'm';
var _mFeet = 'ft';
var _mDecimalPoint = '.';
var _mThousandsSeparator = ',';
var _mMapErrorTile = 'We are sorry, but we don/'t have maps at this zoom level for this region.<p>Try zooming out for a broader look.</p>';
var _mKeyholeErrorTile = 'We are sorry, but we don/'t have imagery at this zoom level for this region.<p>Try zooming out for a broader look.</p>';
var _mTermsURL = 'http://www.google.com/intl/en_ALL/help/terms_local.html';
var _mStaticPath = 'http://www.google.com/intl/en_ALL/mapfiles/';
var _mDomain = 'google.com';
var _mAutocompleteFrom = '';
var _mAutocompleteTo = '';
var _mAutocompleteNearRe = '';
var _mAutocompleteRecentText = '';
function createMapSpecs()
{
var mt = '';
var mtd = '4';
var tv = 'w2.7';
var lrtv = 't2.2';
var apitv = 'ap.3';
var lrapitv = 'tap.2';
var hmt = '';
var hmtd = '4';
var htv = 'w2t.1';
var lrhtv = 't2t.2';
var apihtv = 'apt.1';
var lrapihtv = 'tapt.2';
var kmt = '';
var kmtd = '4';
var kdomain = 'google.com';
var ktv = '3';
var kdisable = false;
var khauth = 'fzwq1IYtIHYv43dMOM4ZDACx0-4vZndBylgelQ';
var kjapandatumhack = false;
var hybrid = (htv != '');
if (!arguments.callee.mapSpecs)
{
var mapSpecs = [];
var tileVersion = window._apiKey ? apitv : tv;
var lrTileVersion = window._apiKey ? lrapitv : lrtv;
var hTileVersion = window._apiKey ? apihtv : htv;
var lrHTileVersion = window._apiKey ? lrapihtv : lrhtv;
var mapCopy = (tileVersion != tv) ? G_MAP_API_COPYRIGHTS :G_MAP_DEFAULT_COPYRIGHTS;
var hybridCopy = (hTileVersion != htv) ? G_MAP_API_COPYRIGHTS :G_MAP_DEFAULT_COPYRIGHTS;
_GOOGLE_MAP_TYPE = new _GoogleMapMercSpec(mt, mtd, tileVersion, mapCopy,lrTileVersion);mapSpecs.push(_GOOGLE_MAP_TYPE);
if (!kdisable)
{
_SATELLITE_TYPE = new _KeyholeMapMercSpec(kmt, kmtd, kdomain, ktv,khauth, kjapandatumhack);
mapSpecs.push(_SATELLITE_TYPE);
if (hybrid)
{
_HYBRID_TYPE = new _HybridMapSpec(kmt, kmtd, kdomain, ktv, khauth,kjapandatumhack, hmt, hmtd,hTileVersion, hybridCopy,lrHTileVersion);
mapSpecs.push(_HYBRID_TYPE);
}
_KATRINA_TYPE = new _KatrinaMapSpec(kmt, kmtd, kdomain, ktv, khauth);mapSpecs.push(_KATRINA_TYPE);
}
arguments.callee.mapSpecs = mapSpecs;
}
return arguments.callee.mapSpecs;
}
var _u = navigator.userAgent.toLowerCase();
function _ua(t) {
return _u.indexOf(t) != -1;
}
function _uan(t)
{
if(!window.RegExp)
{
return 0;
}
var r = new RegExp(t+'([0-9]*)');
var s = r.exec(_u);
var ret = 0;
if (s.length >= 2)
{
ret = s[1];
}
return ret;
}
function _noActiveX()
{
if(!_ua('msie') || !document.all || _ua('opera'))
{
return false;
}
var s = false;
eval('try { new ActiveXObject("Microsoft.XMLDOM"); }'+'catch (e) { s = true; }');
return s;
}
function _compat(){
return ((_ua('opera') &&(_ua('opera 8') || _ua('opera/8'))) ||(_ua('safari') && _uan('safari/') >= 125) ||(_ua('msie') &&!_ua('msie 4') && !_ua('msie 5.0') && !_ua('msie 5.1') &&!_ua('msie 3') && !_ua('msie 5.5') && !_ua('powerpc')) ||(document.getElementById && window.XSLTProcessor &&window.XMLHttpRequest && !_ua('netscape6') &&!_ua('netscape/7.0')));
}
_fc = false;
_c = _fc || _compat();
function _browserIsCompatible()
{
return _c;
}
/*b y 旷 野 无 霜 */
function GBrowserIsCompatible()
{
return _c;
}
function _havexslt()
{
if (typeof GetObject != 'undefined' ||(typeof XMLHttpRequest != 'undefined' &&typeof DOMParser != 'undefined' &&typeof XSLTProcessor != 'undefined'))
{
return true;
} else
{
return false;
}
}
function _script(src)
{
var ret='<'+'script src="'+src+'"'+' type="text/javascript"><'+'/script>';document.write(ret);
}
function GLoadMapsScript()
{
if (_havexslt()){_script("http://maps.google.com/mapfiles/maps.28.js");
}
else if (_ua('safari'))
{
_script("http://maps.google.com/mapfiles/maps.28.safari.js");
}
else
{
_script("http://maps.google.com/mapfiles/maps.28.xslt.js");
}
}
function _el(i)
{
return document.getElementById(i);
}
function _esc(v) {
return ('' + v).replace(new RegExp('<', 'g'),' ');
}
var _nxsl = !_ua('safari');
function _loadnxsl() {
_nxsl = true;
_checkLoad();
}
function _load(xml, doc, loc, home)
{
if (!_c) {return;
}
if (!_m || !_nxsl)
{
window._pending = [];for (var i = 0; i < arguments.length; ++i)
{
window._pending.push(arguments[i]);
}
}
else {
var l = document.location;
if (home && (!l.search || l.pathname == '/lochp')) {_el('resulttab').style.display = 'none';_el('hometab').style.display = '';}
else {_el('resulttab').style.display = '';_el('hometab').style.display = 'none';}_m.loadXML(xml, doc, loc);}}
function _fd() {var se = _el('start');
var ee = _el('end');
var s = se.value;se.value = ee.value;ee.value = s;return false;}function _email() {if (!_c || !_m) return;_m.email();}
function _print()
{
if (!_c || !_m) return;_m.print();}
/*<!--b y 旷 野 无 霜 -->*/
function _createMap()
{
var mapSpecs = createMapSpecs();
_m = new _MapsApplication(_el('map'),_el('panel'),_el('linktopage'),_el('printheader'),_el('printpanel'),mapSpecs);
_m.loadMap();
_m.manageFocus(_el('q'));
_m.manageFocus(_el('what'));
_m.manageFocus(_el('where'));
_m.manageFocus(_el('start'));
_m.manageFocus(_el('end'));
_m.registerForm('maps',_getElementsByClassName('maps_tab'),_el('maps_card'),_el('maps_form'),_el('q'));
_m.registerForm('local',_getElementsByClassName('local_tab'),_el('local_card'),_el('local_form'),_el('what'));
_m.registerForm('directions',_getElementsByClassName('directions_tab'),_el('directions_card'),_el('directions_form'),_el('start'));
_Event.bindDom(_el('where'), 'blur', _m, _m.wblur);
_Event.bindDom(_el('where'), 'focus', _m, _m.wfocus);
_el('maps_form').target = "vp";
_el('local_form').target = "vp";
_el('directions_form').target = "vp";
}
function _loadbody() {_checkLoad();}
function _checkLoad() {
if (window._pending)
{
var pending = window._pending;
window._pending = null;
_load.apply(this, pending);
}
}
function getDirectionsStart() {
return _el('start');
}
function getDirectionsEnd()
{
return _el('end');
}
var _m = null;
var _sf = 'hl=en';
if (!_c)
{
window.location.href = '';
}
window.document.vpage = '<?xml version="1.0"?><page><title></title><query></query><request><url>http://maps.google.com/?num=10</url><canonicalnear></canonicalnear></request><center lat="37.062500" lng="-95.677068"/><span lat="23.875000" lng="57.630033"/><overlay panelStyle="/maps?file=hp&hl=en"><category query=""></category><locations start="" num="" max=""></locations></overlay></page>';
var _mEmailSubject = 'Google Local';
var _mSearching = 'Searching...';
var _mMapAreaBelow = 'the map area below';
var _mLocalSearch = 'Local Search';
var _mMoreReferences = '%1$d more';
var _mSearchResultsNear = 'Search results for <b>%1$s</b> near <b>%2$s</b>';
var _mSearchResultsInThisMap = 'Search results for <b>%1$s</b> in this map';
var _mUePrintLink = 'To see all the details that are visible on the screen,use the "Print" link next to the map.';
var _mPrintSorry = '';
var _mDirections = 'Directions';
var _mWhat = 'What';
var _mWhere = 'Where';
var _mStartAddress = 'Start address';
var _mEndAddress = 'End address';
var _mStartAtLocation = 'The map will start on <b>%1$s</b> next time you visit the site.';//]]>
//-->
</script>
<title>Google Local</title>
<style type="text/css">
body {background-color: white;color: black;font-family: Arial;margin-top: 3px;margin-bottom: 0px;}table {border-collapse: collapse;}td {padding: 0;}img {border: 0;}a {color: #0000cc;}form {margin: 0;}#logo {width: 150px;height: 55px;border: 0;margin-top: 9px;}#header { position: relative;z-index: 1000;background-color: white;margin-bottom: 10px;}#header td { background-color: white;}#header .form .menu {padding-bottom: 4px;padding-left: 2px;font-size: small;}#tabs td {padding-bottom: 5px;padding-top: 4px;padding-left: 4px;}a.selected {font-weight: bold;text-decoration: none;color: black;}#headertitle {position: relative;border-top: 1px solid #ff9900;background-color: #ffeac0;margin-bottom: 7px;width: 100%;z-index: 1000; }#headertitle td.title {font-size: large;font-weight: bold;padding-left: 3px;white-space: nowrap;}#headertitle td.tools {font-size: small;text-align: right;padding-right: 3px;white-space: nowrap;}#headertitle td.tools a {text-decoration: none;white-space: nowrap;}#headertitle td.tools a span {text-decoration: underline;white-space: nowrap;}#headertitle td.tools a img {width: 16px;height: 16px;vertical-align: bottom;}#headertitle td.tools #toggle a {text-decoration: underline;}#local_card td, #directions_card td {background-color: white /* #ffeac0 */;}#page {position: relative;width: 100%;height: 100%;z-index: 0; }#map {position: relative;margin-left: 20.4em;height: 100%;border: 1px solid #979797;z-index: 0; }#panel {position: absolute;top: 0px;left: 0px;width: 20em;background-color: white;z-index: 1000; }#directions_form td.reverse {padding-left: 2px;padding-right: 2px;vertical-align: middle;}#header td.submit {vertical-align: top;white-space: nowrap;}#header td.help {font-size: x-small;vertical-align: top;white-space: nowrap;padding-left: 7px;}#header td.boxlabel {font-size: 70%;padding-top: 1px;padding-left: 1px;}.example {color: gray;}#panel table.directions td,#panel table.dirsummary td {font-size: small;border: 1px solid silver;padding: 0.2em;vertical-align: top;}#panel div.dirlegal {padding-top: 1em;padding-left: 0.2em;padding-right: 0.2em;font-size: 70%;color: #666666;}#panel div.reverse {padding-top: 0.6em;padding-right: 0.2em;padding-bottom: 0.5em;font-size: small;}#panel table.directions td.num,#panel table.dirsummary td.name {white-space: nowrap;background-color: #eeeeee;}#panel table.directions td.num {text-align: right;}#panel table.directions td.desc, table.dirsummary td.value {width: 100%;}#panel table.directions td.desc, table.directions td.num {cursor: pointer;}#panel table.directions td.dist {white-space: nowrap;text-align: right;}#panel table.directions td.gap {text-align: center;border-left: none;border-right: none;padding: 0px;}#panel div.gap {font-family: sans-serif;margin-top: -0.5em;}.noselect {-moz-user-select: none;}v/:* {behavior:url(#default#VML);}.mapselectedlocation {background-color: #eeeeee;}@media screen {html, body {overflow: hidden;}.noscreen {display: none;}#transparent, #vp, #nxsl {position: absolute;top: -10px;left: -10px;width: 5px;height: 5px;visibility: hidden;}#printheader {display: none;}}@media print {.noprint {display: none;}body {margin: 0;color: black;}a {text-decoration: none;color: black; }#screenheader, #bug, #links, #metapanel, #headertitle,table.form, #vp, #transparent, #nxsl {display: none;}#header {margin-bottom: 7mm;}#printheader {padding-top: 1em;text-align: left;}#printmessage {display: block;position: absolute;z-index: 100000;top: 0mm;right: 0mm;width: 7cm;padding: 1.5mm 2mm;color: black;background-color: silver;border: 1px solid black;text-align: center;font-size: 6pt;font-family: san-serif;}#page {position: static;width: auto;height: auto;}#map {position: relative;margin-left: 0;margin-right: auto;overflow: hidden;}.printimage {width: 100%;border: 1px solid silver;}#printpanel {position: static;width: 100%;margin-top: 5mm;}#printpanel table {width: 100%;orphans: 2;widows: 2;page-break-inside: auto;}#printpanel table tr {page-break-after: auto;}#printpanel div.reverse {display: none;}#printpanel table.directions {margin-top: 4mm;}#printpanel table.directions td,#printpanel table.dirsummary td {font-size: 12pt;line-height: 16pt;border: none;vertical-align: top;}#printpanel table.directions td.num {text-align: right;}#printpanel table.directions td.desc,#printpanel table.dirsummary td.value {padding-left: 1em;}#printpanel table.directions td.gap {text-align: left;}#printpanel table.directions div.gap {margin-left: 20mm;}.dirlegal {margin-top: 4mm;width: 100%;font-size: 8pt;}}</style>
<script>
<!--
//-->
</script>
</head>
<body οnlοad="_loadbody();">
<script><!--
function qs(el)
{
if(window.RegExp && window.encodeURIComponent)
{
if(_m){el.href=_m.getTabURL(el.href);
}
}
}
//-->
</script>
<iframe name="vp" id="vp" src="/mapfiles/home2.html"></iframe>
<div class="noprint">
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td align="right" nowrap>
<font size="-1"><a href="http://local.google.com/support?hl=en">Help</a></font></td>
</tr>
<tr height="4">
<td>
<img alt="" width="1" height="1"></td>
</tr>
</table>
</div>
<table id="header">
<tr>
<td class="logo">
<a href="/maps">
<img id="logo" src="http://www.google.com/intl/en_ALL/images/local_res_logo3.gif"
width="150" height="55" alt="Go to Google Local Home" /></a></td>
<td>
</td>
<td valign="top" width="100%">
<div class="noscreen" id="printheader">
</div>
<div class="noprint" id="resulttab" style="display: none">
<table>
<tr>
<td id="tabs">
<script><!--
function qs(el)
{
if (window.RegExp && window.encodeURIComponent)
{
if(_m)
{
el.href=_m.getTabURL(el.href);
}
}return 1;
}
// -->
</script>
<table border="0" cellpadding="4" cellspacing="0">
<tr>
<td class="q">
<font size="-1"><a id="t0a" class="q" href="http://www.google.com/search?sa=N&tab=lw"
οnclick="return qs(this);">Web</a> <a id="t1a" class="q" href="http://images.google.com/images?sa=N&tab=li"
οnclick="return qs(this);">Images</a> <a id="t2a" class="q"
href="http://groups.google.com/groups?sa=N&tab=lg" οnclick="return qs(this);">Groups</a> <a
id="t4a" class="q" href="http://news.google.com/news?sa=N&tab=ln" οnclick="return qs(this);">News</a> <a
id="t5a" class="q" href="http://froogle.google.com/froogle?sa=N&tab=lf" οnclick="return qs(this);">Froogle</a> <font
color="#000000"><b>Local</b></font> <b><a href="/intl/en/options/"
class="q">more »</a></b></font></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<div class="noprint" id="hometab">
<table>
<tr>
<td id="tabs">
<script><!--
function qs(el) {
if (window.RegExp && window.encodeURIComponent)
{
if(_m)
{
el.href=_m.getTabURL(el.href);
}
}
return 1;
}
// -->
</script>
<table border="0" cellspacing="0" cellpadding="4">
<tr>
<td nowrap>
<font size="-1"><a id="0a" class="q" href="/webhp?hl=en&tab=lw" οnclick="return qs(this);">
Web</a> <a id="1a" class="q" href="/imghp?hl=en&tab=li" οnclick="return qs(this);">
Images</a> <a id="2a" class="q" href="http://groups.google.com/grphp?hl=en&tab=lg"
οnclick="return qs(this);">Groups</a> <a id="4a" class="q"
href="http://news.google.com/nwshp?hl=en&tab=ln" οnclick="return qs(this);">News</a>
<a id="5a" class="q" href="http://froogle.google.com/frghp?hl=en&tab=lf" οnclick="return qs(this);">
Froogle</a> <b>Local</b> <b> <a href="/intl/en/options/"
class="q">more »</a></b></font></td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<table class="form">
<tr>
<td style="vertical-align: top">
<table>
<tr>
<td>
<form name="gs" id="maps_form" action="/maps" method="GET">
<div id="maps_card">
<input type="hidden" name="output" value="html" />
<table>
<tr>
<td>
<input tabindex="0" name="q" id="q" type="text" style="width: 400px;" value="" /></td>
<td rowspan="2" class="submit">
<input tabindex="5" name="btnG" id="submitq" type="submit" value="Search" /></td>
<td rowspan="2" class="help">
<div style="font-weight: bold">
Search the map</div>
<div>
<a href="/maps?f=l" class="local_tab">Find businesses</a></div>
<div>
<a href="/maps?f=d" class="directions_tab">Get directions</a></div>
</td>
</tr>
<tr>
<td class="boxlabel">
<span style="color: gray">e.g., "hotels near lax" or "10 market st, san
francisco"</span></td>
</tr>
</table>
</div>
</form>
<form id="local_form" action="/maps" method="GET">
<div id="local_card" style="display: none">
<input type="hidden" name="output" value="html" />
<table>
<tr>
<td style="white-space: nowrap">
<input tabindex="1" name="q" id="what" type="text" style="width: 165px" /></td>
<td class="reverse" style="width: 6px">
</td>
<td>
<input tabindex="2" name="near" id="where" type="text" style="width: 225px" /></td>
<td rowspan="2" class="submit">
<input tabindex="5" name="btnG" id="submitl" type="submit" value="Search" /></td>
<td rowspan="2" class="help">
<div>
<a href="/maps" class="maps_tab">Search the map</a></div>
<div style="font-weight: bold">
Find businesses</div>
<div>
<a href="/maps?f=d" class="directions_tab">Get directions</a></div>
</td>
</tr>
<tr>
<td class="boxlabel">
What <span class="example">e.g., pizza</span></td>
<td>
</td>
<td class="boxlabel">
Where <span class="example">e.g., Poughkeepsie, NY</span></td>
</tr>
</table>
</div>
</form>
<form id="directions_form" action="/maps" method="GET">
<div id="directions_card" style="display: none">
<input type="hidden" name="output" value="html" /><table>
<tr>
<td>
<input tabindex="3" name="saddr" id="start" type="text" style="width: 191px" /></td>
<td class="reverse">
<a href="" οnclick="return _fd()">
<img src="/mapfiles/ddirflip.gif" width="10" height="14" alt="Switch start and end address"
title="Switch start and end address" /></a></td>
<td>
<input tabindex="4" name="daddr" id="end" type="text" style="width: 191px" value="" /></td>
<td rowspan="2" class="submit">
<input tabindex="5" name="btnG" id="submitd" type="submit" value="Search" /></td>
<td rowspan="2" class="help">
<div>
<a href="/maps" class="maps_tab">Search the map</a></div>
<div>
<a href="/maps?f=l" class="local_tab">Find businesses</a></div>
<div style="font-weight: bold">
Get directions</div>
</td>
</tr>
<tr>
<td class="boxlabel">
Start address</td>
<td>
</td>
<td class="boxlabel">
End address</td>
</tr>
</table>
</div>
</form>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table id="headertitle">
<tr>
<td class="title">
Local</td>
<td style="text-align: right; width: 50%; white-space: nowrap;">
<span id="toggle" style="margin-right: 1em"></span>
</td>
<td class="tools">
<span class="noprint" id="links"><a href="javascript:_print()">
<img src="/mapfiles/bar_icon_print_2.gif" alt="Print" /> <span>Print</span></a> <a
href="javascript:_email()"><img src="/mapfiles/bar_icon_email_2.gif" alt="Email" /> <span>Email</span></a> <a
id="linktopage" href=""><img src="/mapfiles/bar_icon_link.gif" alt="Link to this page" /> <span>Link
to this page</span></a></span></td>
</tr>
</table>
<script type="text/javascript"><!--
//<![CDATA[
if (_c)
{try {var q = _el('q');q.focus();if (q.setSelectionRange) {q.setSelectionRange(0, 0);}} catch (e) {}document.write('<div id="loading">Loading...</div>');}//]]>
//-->
</script>
<script type="text/javascript"><!--
//<![CDATA[
if (_c) {GLoadMapsScript();}//]]>
//-->
</script>
<script type="text/javascript"><!--
//<![CDATA[
if (_c && _noActiveX())
{
document.write('<meta http-equiv="refresh" content="0; URL=http://maps.google.com/?output=html"/>');
}
else if (_c)
{
_makePasteBox(_el('q'));
_makePasteBox(_el('start'));
_makePasteBox(_el('end'));
_el('loading').style.display = 'none';
document.write('<div id="page">');
document.write('<div id="map"></div>);
document.write('<div id="panel" class="noprint"></div>');
document.write('</div>');
document.write('<div id="printpanel" class="noscreen"></div>');
_createMap();
}
else
{
document.write
(
'<meta http-equiv="refresh" content="0; URL=http://maps.google.com/?output=html"/>');
}
if (!_nxsl)
{
var nxsrc = '/maps?file=sf&' + _sf;
var nxtxt = '<iframe id="nxsl" οnlοad="_loadnxsl()" src="' + nxsrc + '"></iframe>';
document.write(nxtxt);}//]]>
//-->
</script>
<script type="text/javascript"><!--
document.write('<img id="transparent" src="http://www.google.com/mapfiles/transparent.gif"/>');
//-->
</script>
<!--by 旷野无霜-->
</body>
</html>
扫一扫
912
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
![http://www.google.com/mapfiles/transparent.gif"/>'](/s/com/google/www/G.http/mapfiles/transparent.gif"/>'%20rel=){kind=link}